ES6语法的笔记 | 青训营笔记

52 阅读2分钟

这是我参与「第五届青训营 」笔记创作活动的第12天。

ES6语法的笔记

let,const声明变量

  • var 和 let 、const的区别是:

    • 没有变量提升
    • 是一个块级作用域
    • 不能重复声明
  • const声明常量,一旦被声明 无法修改

  • 使用let声明变量不会污染全局变量

  • 建议:在默认情况下用const,而只有在你知道变量值需要被修改的时候,使用let

模板字符串

  • tab键上面的反引号 直接拼接html

强大的函数

  • 带参数的默认值函数
function add(a = 10,b = 20){
    return a + b;
}
  • 默认的表达式也可以是一个函数
function add(a ,b = getVal(5)){
    return a + b;
}
function getVal(val){
    return val + 5;
}
console.log(add(10));
  • 剩余运算符 …keys

  • 扩展运算符 …arr

  • 箭头函数注意事项:

    • 使用箭头函数 函数背部没有arguments 因为箭头函数没有作用域链
    • 箭头函数不能使用new关键字来实例化对象 它不是一个对象

解构赋值

  • 解构赋值是对赋值运算符的一种扩展
  • 他针对数组和对象来进行操作
  • 优点:代码书写上简洁易读
let node = {
    type:"id",
    name:"yuanshen"
}
let {type,name} = node;
console.log(type,name);

// 对数组解构
let arr =[1,2,3]
let [a, b,c] = arr
console.log(a, b)

symbol

  • 原始数据类型Symbol,他表示是独一无二的值
  • 最大的用途:用来定义对象的私有变量
  • 取值一定要用[变量名]

Map 和 Set

数组的扩展功能 from() 和 of()

from()

let arr = Array.from(arguments);
console.log(arr);

of()

console.log(Array.of(3, 11, 20, [1, 2, 3], {id : 1}))
console.log([1, 2, 3, 8, 9, 10].copywithin(0, 3));// [8, 9, 10, 8, 9, 10]

// find()找出第一个符合条件的数组成员
let num = [1, 2, -10, -20, 9, 2].find(n => n < 0)
console.log(num);// -10

//findIndex()找出第一个符合条件的数组成员的索引
let numIndex = [1, 2, -10, -20, 9, 2].findIndex(n => n < 0)
console.log(numIndex)

for … of循环进行遍历

// entries() keys() values() 返回一个遍历器  可以使用for...of循环进行遍历
for(let index of ['a', 'b'].keys()) {
    console.log(index);// 0   1
}
for(let val of ['a', 'b'].values()) {
    console.log(val);// a   b
}
for(let [index, val] of ['a', 'b'].entries()) {
    console.log(index, val);// 0, a   1, b
}

includes() 替代之前的indexOf()

// includes()返回一个布尔值, 表示某个数组是否包含给定的值
console.log([1, 2, 3].includes(2));// true
console.log([1, 2, 3].includes('4'));// false

生成器

function* func() {
    yield 2;
}
let fn = func();
console.log(fn.next());

// 总结:generator函数是分段执行的,yield语句是暂停执行  而next()恢复执行