星哥の面试题Day13
面试题系列均来自鱼皮的知识星球——编程导航
CSS 中,有哪些方式可以隐藏页面元素?有什么区别?
display:none(元素不可见,不占据空间,无法响应点击事件,会触发重排重绘)
visibility:hidden(元素不可见,占据页面空间,无法响应点击事件,会触发重绘)
opacity:0(元素不可见,占据页面空间,可以响应点击事件,会触发重绘)
设置height、width模型属性为0,有内容还要设置overflow:hidden;(元素不可见,不占据页面空间,无法响应点击事件)
position:absolute(脱标定位到页面外,元素不可见,不影响页面布局)
clip-path(元素不可见,占据页面空间,无法响应点击事件)
什么是 JS 对象的可枚举性(enumerable)?
什么是 JS 对象的可枚举性
对象的可枚举型是指:
对象中某些属性是否可以被 for…in 循环或者 Object.keys()函数枚举到,如果一个属性是可枚举的,则会出现在枚举过程中,反之则不会。
每个属性都有一个名字和一个属性描述符,属性描述符里面包括了该属性的许多特性,如可枚举性、可写性、可配置性和值等。
默认情况下,使用字面量或Object()构造函数创建的对象的所有属性都是可枚举的,可以使用Object.defineProperty或Object.defineProperties()来设置enumerable特性为false,设置其不可枚举
tip:
Object.keys()作用:用于返回一个 给定对象其自身可枚举的属性 的数组,该方法接收一个对象作为参数,返回该对象中所有可枚举属性的名称组成的一个数组,该数组中的的属性名称按照对象属性定义顺序一致,如果该对象里面的属性没有一个是可枚举性的,则返回空数组。
Object.defineProperty()作用:用来定义一个新的属性或者修改原有的属性
Object.defineProperties()作用:用来定义或修改多个属性
这两种都是可以自定义属性的行为,例如定义或修改属性是否可写、可枚举、可配置等;
它们接收三个参数:1、obj对象;2、prop:要定义或修改的属性名称;3、descriptor:要定义或修改的属性描述符
descriptor的属性描述符包括的特性有:
- value:属性的值,默认为undefined
- writable:属性是否可写,默认为false
- enumerable:属性是否可枚举,默认为false
- configurable:属性是否可配置,默认为false
- get:获取属性值的方法
- set:设置属性值的方法
Vue 中 computed 和 watch 区别?分别适用于什么场景?
Vue 中的 computed
和 watch
是两种用于响应式数据更新的方法。
computed
是计算属性,它会根据响应式数据的变化自动计算出新的值,并缓存结果,只有在计算属性所依赖的响应式数据发生改变时才会重新计算。computed
适用于需要根据响应式数据计算得出结果的场景,例如根据商品的数量和单价计算商品的总价,或者根据选中的过滤条件过滤出数据列表。
watch
是侦听器,它可以监听指定的响应式数据的变化,并在数据发生改变时执行指定的回调函数。watch
适用于需要执行一些异步或复杂操作的场景,例如监听表单输入框的变化并发送 Ajax 请求,或者监听路由变化并根据路由参数切换页面。
总的来说,computed
适用于计算数据的场景,而 watch
适用于需要执行异步或复杂操作的场景。