js中的Iterator 和 for...of 循环及小记

69 阅读1分钟

持续创作,加速成长!这是我参与「掘金日新计划 · 6 月更文挑战」的第1天,点击查看活动详情

Iterator是什么?

Iterator就是我们常说的遍历器,可以把它理解为一种接口,它可以为各种数据结构提供相同的访问方法。这里的数据结构主要指数组、对象和es6中新增的Map和Set。当给这些数据增加了Iterator后,就可以实现遍历操作了。

遍历器的作用

  • 简化访问方式,为各种数据结构提供一致的访问方法
  • 使得数据结构中的项可以按序排列
  • 主要配合for...of使用 一般来说只要是有Symbol.iterator属性的数据结构都可以进行遍历(不管是原生具备的iterator还是后来自己加的都可以)

原生自带Symbol.iterator属性的数据结构有:

  • Array
  • Map
  • Set
  • String
  • TypedArray
  • 函数中的(arguments)
  • 节点列表(NodeList)

|| 和 && 运算符

a || b a为真咋为a,a为假则为b a && b a为真咋为b,a为假则为a

通过this.$parent.XXX 可以获取到父组件中data中的值

ctrl+D多选,同时修改多个字段,ctrl+u去掉多选的字段

给组件绑定原生事件时,需要使用.native修饰符,如果不写,则表示这个事件是自定义事件(this.$on('click',function(){...})) <z-button @click.native="clickHandler">按钮

当操作数组或者对象的时候可能出现新增和删除一个项并没有响应式的情况,这是因为新增的项没有set和get方法,这是就要使用如下方法来解决

Vue.set(对象,'属性名',值)
或者
this.$set(对象,'属性名',值)
或者直接覆盖原对象
this.对象名 = {
    ...this.对象名,
    新属性:'属性值'
}