ECMAScript 6 阅读笔记

1.如果要将一个已经声明的变量用于解构赋值,必须非常小心。
// 错误的写法
let x;
{x} = {x: 1};
// SyntaxError: syntax error
上面代码的写法会报错,因为JavaScript引擎会将{x}理解成一个代码块,从而发生语法错误。
只有不将大括号写在行首,避免JavaScript将其解释为代码块,才能解决这个问题。
代码块中必须有赋值表达式,否则出错。
// 正确的写法
({x} = {x: 1});

2.由于数组本质是特殊的对象,因此可以对数组进行对象属性的解构。
let arr = [1, 2, 3];
let {0 : first, [arr.length - 1] : last} = arr;
first // 1
last // 3

3.map()函数 :返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组。
[[1, 2], [3, 4]].map(([a, b]) => a + b);
// [ 3, 7 ]
通常情况下,map 方法中的 callback 函数只需要接受一个参数(很多时候,自定义的函数形参只有一个),就是正在被遍历的数组元素本身。
但这并不意味着 map 只给 callback 传了一个参数(会传递3个参数)。这个思维惯性可能会让我们犯一个很容易犯的错误。

4.[]一般用来代表数组,{}一般用来代表对象。

5.charAt()用来表示指定位置的字符,eval() 函数可计算某个字符串。

6.replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
字符串对象共有4个方法,可以使用正则表达式:match()、replace()、search()和split()。

7.isNaN() 函数用于检查其参数是否是非数字值。

8.Array.of方法用于将一组值,转换为数组。
Array.from方法用于将两类对象转为真正的数组:类似数组的对象(array-like object)和可遍历(iterable)的对象(包括ES6新增的数据结构Set和Map)。
下面是一个类似数组的对象,Array.from将它转为真正的数组。
let arrayLike = {
‘0’: ‘a’,
‘1’: ‘b’,
‘2’: ‘c’,
length: 3
};
// ES5的写法
var arr1 = [].slice.call(arrayLike); // [‘a’, ‘b’, ‘c’]
// ES6的写法
let arr2 = Array.from(arrayLike); // [‘a’, ‘b’, ‘c’]

Array.from方法会将数组的空位,转为undefined,也就是说,这个方法不会忽略空位。

9.数组实例的find方法,用于找出第一个符合条件的数组成员。它的参数是一个回调函数,所有数组成员依次执行该回调函数,直到找出第一个返回值为true的成员,然后返回该成员。如果没有符合条件的成员,则返回undefined。
数组实例的findIndex方法的用法与find方法非常类似,返回第一个符合条件的数组成员的位置,如果所有成员都不符合条件,则返回-1。

10.fill方法使用给定值,填充一个数组。fill方法还可以接受第二个和第三个参数,用于指定填充的起始位置和结束位置。
[‘a’, ‘b’, ‘c’].fill(7, 1, 2)
// [‘a’, 7, ‘c’]

11.entries(),keys()和values()——用于遍历数组。它们都返回一个遍历器对象(详见《Iterator》一章),可以用for…of循环进行遍历,唯一的区别是keys()是对键名的遍历、values()是对键值的遍历,entries()是对键值对的遍历。

12.Array.prototype.includes方法返回一个布尔值,表示某个数组是否包含给定的值,与字符串的includes方法类似。

13.filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素。

14.length属性的返回值,等于函数的参数个数减去指定了默认值的参数个数。
如果设置了默认值的参数不是尾参数,那么length属性也不再计入后面的参数了。
(function (a = 0, b, c) {}).length // 0
(function (a, b = 1, c) {}).length // 1

15.扩展运算符(spread)是三个点(…)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。
该运算符将一个数组,变为参数序列。
function f(v, w, x, y, z) { }
var args = [0, 1];
f(-1, …args, 2, …[3]);

16.扩展运算符的应用
1.合并数组
// ES5的合并数组
arr1.concat(arr2, arr3);
// [ ‘a’, ‘b’, ‘c’, ‘d’, ‘e’ ]
// ES6的合并数组
[…arr1, …arr2, …arr3]
// [ ‘a’, ‘b’, ‘c’, ‘d’, ‘e’ ]
2.与解构赋值结合
// ES5
a = list[0], rest = list.slice(1) slice(start必需,end可选) 方法可从已有的数组中返回选定的元素。
// ES6
[a, …rest] = list
如果将扩展运算符用于数组赋值,只能放在参数的最后一位,否则会报错。

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值