这是我参与「第五届青训营 」笔记创作活动的第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()恢复执行