美文网首页nodejs学习
nodejs中扩展运算符

nodejs中扩展运算符

作者: 村东头元旦家 | 来源:发表于2018-12-06 16:06 被阅读37次

该文章中大多数都是转载:http://es6.ruanyifeng.com    

感谢阮一峰老师的文章为我解答了不少疑惑。

含义

扩展运算符(spread)是三个点(...)。它好比 rest 参数的逆运算,将一个数组转为用逗号分隔的参数序列。

console.log(...[1, 2, 3])

// 1 2 3

console.log(1, ...[2, 3, 4], 5)

// 1 2 3 4 5

console.log([...document.querySelectorAll('div')]);

// [<div>, <div>, <div>]

该运算符主要用于函数调用。

function push(array, ...items) {

  array.push(...items);

}

function add(x, y) {

  return x + y;

}

const numbers = [4, 38];

add(...numbers) // 42

上面代码中,array.push(...items)和add(...numbers)这两行,都是函数的调用,它们的都使用了扩展运算符。该运算符将一个数组,变为参数序列。

扩展运算符与正常的函数参数可以结合使用,非常灵活。

function f(v, w, x, y, z) { }

const args = [0, 1];

f(-1, ...args, 2, ...[3]);

替代函数的 apply 方法 

由于扩展运算符可以展开数组,所以不再需要apply方法,将数组转为函数的参数了。

// ES5 的写法

function f(x, y, z) {

  // ...

}

var args = [0, 1, 2];

f.apply(null, args);

// ES6的写法

function f(x, y, z) {

  // ...

}

let args = [0, 1, 2];

f(...args);

下面是扩展运算符取代apply方法的一个实际的例子,应用Math.max方法,简化求出一个数组最大元素的写法。

// ES5 的写法

Math.max.apply(null, [14, 3, 77])

// ES6 的写法

Math.max(...[14, 3, 77])

// 等同于

Math.max(14, 3, 77);

上面代码中,由于 JavaScript 不提供求数组最大元素的函数,所以只能套用Math.max函数,将数组转为一个参数序列,然后求最大值。有了扩展运算符以后,就可以直接用Math.max了。

另一个例子是通过push函数,将一个数组添加到另一个数组的尾部。

// ES5的 写法

var arr1 = [0, 1, 2];

var arr2 = [3, 4, 5];

Array.prototype.push.apply(arr1, arr2);

// ES6 的写法

let arr1 = [0, 1, 2];

let arr2 = [3, 4, 5];

arr1.push(...arr2);

上面代码的 ES5 写法中,push方法的参数不能是数组,所以只好通过apply方法变通使用push方法。有了扩展运算符,就可以直接将数组传入push方法。

下面是另外一个例子。

// ES5

new (Date.bind.apply(Date, [null, 2015, 1, 1]))

// ES6

new Date(...[2015, 1, 1]);

相关文章

  • nodejs中扩展运算符

    该文章中大多数都是转载:http://es6.ruanyifeng.com 感谢阮一峰老师的文章为我解答了不少...

  • ES6之扩展运算符与应用(对象篇)

    对象的扩展运算符 《ES6之扩展运算符与应用(数组篇)》一文中,已经介绍过了扩展运算符(...). ES2017将...

  • [转载]扩展运算符...

    原文:JavaScript 扩展运算符 扩展运算符格式 扩展运算符格式很简单,就是三个点(...) 扩展运算符作用...

  • es6之扩展运算符 三个点(...)

    对象的扩展运算符 理解对象的扩展运算符其实很简单,只要记住一句话就可以: 对象中的扩展运算符(...)用于取出参数...

  • es6之扩展运算符 三个点(...)

    es6之扩展运算符 三个点(...)对象的扩展运算符数组的扩展运算符总结es6之扩展运算符 三个点(…)对象的扩展...

  • 扩展运算符(...)

    对象中的扩展运算符(...)用于去除参数对象中的所有可遍历属性,拷贝到当前对象中。 扩展运算符同样可以运用到对数组...

  • MySQL语句

    where运算符 and or order by COUNT(*) 统计总条数 AS 设置列别名 nodejs 中...

  • es6之扩展运算符 三个点(...)

    es6之扩展运算符 三个点(…) 对象的扩展运算符理解对象的扩展运算符其实很简单,只要记住一句话就可以:对象中的扩...

  • 内置对象扩展(Array)

    Array 的扩展方法 扩展运算符(展开语法) 扩展运算符可以将数组或者对象转为用逗号分隔的参数序列 扩展运算符可...

  • nodejs扩展运算符的应用

    nodejs复制数组,合并数组 1、复制数组: 数组是符合的数据类型,直接复制的话,只是复制了指向底层数据结构的指...

网友评论

    本文标题:nodejs中扩展运算符

    本文链接:https://www.haomeiwen.com/subject/jveocqtx.html