ES6展开运算符(扩展运算符)

原文连接git

在ES6中,咱们有了一个新的运算符--展开运算符,它可使咱们的代码的数量有必定的减小,有时候甚至有颇有用的做用,咱们来举几个经常使用的例子,同时经过例子来了解展开运算符的使用。es6

1.apply中的使用github

当咱们的函数有多个变量的时候(特别是当咱们不知道变量的数量的时候),有时候会经过将变量保存在数组中,并经过call来执行函数,有了展开运算符后则有了更好的方式(毕竟使用call须要手动指定this,有时候会不是很方便很准确)ajax

// 通常
function a(x, y, z) { }
var args = [0, 1, 2];
a.apply(null, args);

// 展开运算符
a(...args);
复制代码

除此以外还能够json

// 须要传入不定数量的参数,同时最后一个参数为须要指定的值
function b() {
  console.log(arguments.length);
  console.log(arguments[arguments.length -1]);
}
var args = [0, 1, 2];
b(...args, -2)
复制代码

总的来讲,使多参数的函数调用有了新的方式, 并且避免的做用域的问题。api

2.数组中的使用数组

数组的合并promise

var a = [1, 2];
var b = [0, ...a, 3]
复制代码

数组的分割bash

var [a, ...b] = [0, 1, 2];
console.log(b) // [1, 2]
复制代码

数组的拷贝babel

var a = [1, 2];
var b = [...a];
复制代码

3.对象中的使用 这里的对象是指相似{a:1}这样的对象,由于数组,函数也是对象中的一种。

let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
console.log(z) // {a: 3, b: 4}
复制代码

这个在函数的参数中也有很好的用处

function test(...args) {
  console.log(args);
}

test('wang', '23', 'man');
复制代码

可能会有人说arguments自己就能够啊,可是arguments自己并非数组,因此没法直接对arguments进行数组操做。

类外,在Node中有不少的回调函数都是以error为第一返回值,其实不少接口都是那么设计的。那么咱们能够很方便的分离error和其余参数

request.get('./demo', (e, ...data) => {
  console.log(e);
  console.log(data);
})
复制代码

不过如今的ES6中还不支持在对象中使用扩展运算符,这个还在ES7的草案中,不过咱们可使用babel来处理。

最后写一个例子吧,在github上有这个一个库https://github.com/sindresorhus/pify用于将回调的函数改成promise形式

const fs = require('fs');

const pify = function(fn) {
  return function(...args) {
		return new Promise((resolve) => {
			fn(...args, (...res) => {
				resolve(res);
			})
		})
	}
};

// fs.readFile
pify(fs.readFile)('./package.json', 'utf8').then(([err, data]) => {
	console.log(data);
})

// ajax
pify(request)('http://demo.api.com').then(([err, data]) => {
  console.log(data)
})

复制代码
相关文章
相关标签/搜索