一.字符串扩展
1.indexOf和index
之前做项目,遇到判断一个字符串是否存在,不清楚用index还是indexOf,百度之后,用了indexOf。indexOf:返回某个指定的字符串值在字符串中首次出现的位置 ,如果没有找到这个值就返回-1,这一点很好用,注意,indexOf对大小写敏感。index返回下拉列表中选项的索引位置。
而ES6提供了3种判断字符串是否存在的方法。①.includes() 返回布尔值,是否找到该字符串 ②.startsWith() ③.endsWith() 他们可以提供第二个参数,表示搜索的位置,endsWith()和他们不同,他是针对前n个字符,二其他的是针对从第n个开始直到结束。
二.函数的扩展
1.箭头函数使用注意事项:
(1).函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象
(2).不可以当作构造函数,也就是说,不可以使用new命令,否则会抛出错误
(3).不可以使用arguments对象,该对象在函数体内不存在,如果要用,可以用rest参数代替
(4).不可以使用yield命令,因此箭头函数不能用作Generator函数
注意,this对象的指向是可变的,但是在箭头函数中,它是固定的
function foo() { setTimeout(() => { console.log('id:', this.id); }, 100); } var id = 21; foo.call({ id: 42 }); // id: 42
//如果是普通函数,执行时this应该指向全局对象window,这时输出21
三.数组扩展
1.Rest
rest参数,形式为 "...变量名",用于获取函数多余参数,将多余参数放在数组中,和扩展运算符可以理解为互为逆函数
扩展运算符:形式为"...",它是rest参数的逆运算,将一个数组转为用逗号分隔的参数序列
例如:var list = ['大家好'] list.length =1,list[0]=大家好
var list = [...'大家好'] list.length =3,list[0]=大,list[1]=家,list[2]=好
扩展运算符最有用之一是:Math.max(...arr),比较数组中的最大值 ES5的写法是:Math.max.apply(null,[1,2,3])
2.扩展运算符的作用
(1).复制数组
// ES5 const a1 = [1,2] const a2 = a1.concat() // ES6 const a1 = [1,2] const a2 = [...a1] 或者 const[...a2] = a1
(2).合并数组
// ES5 [1, 2].concat(more) // ES6 [1, 2, ...more] var arr1 = ['a', 'b']; var arr2 = ['c']; var arr3 = ['d', 'e']; // ES5的合并数组 arr1.concat(arr2, arr3); // [ 'a', 'b', 'c', 'd', 'e' ] // ES6的合并数组 [...arr1, ...arr2, ...arr3] // [ 'a', 'b', 'c', 'd', 'e' ]
(3).与解构赋值结合(如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则报错)
// ES5 a = list[0], rest = list.slice(1) // ES6 [a, ...rest] = list