filter() 方法返回符合一定条件的元素。
该方法让您规定一个条件。不符合条件的元素将从选择中移除,符合条件的元素将被返回。
该方法通常用于缩小在被选元素组合中搜索元素的范围。
ES6中引入了一种编写函数的新语法
// ES5
var selected = allJobs.filter(function (job) {
return job.isSelected();
});
// ES6
var selected = allJobs.filter(job => job.isSelected());
当你只需要一个只有一个参数的简单函数时,可以使用新标准中的箭头函数,它的语法非常简单:标识符=>表达式
。你无需输入function
和return
,一些小括号、大括号以及分号也可以省略。
如果要写一个接受多重参数(也可能没有参数,或者是不定参数、默认参数、参数解构)的函数,你需要用小括号包裹参数list。
// ES5 var total = values.reduce(function (a, b) { return a + b; }, 0); // ES6 var total = values.reduce((a, b) => a + b, 0);
那么不是非常函数化的情况又如何呢?除表达式外,箭头函数还可以包含一个块语句。回想一下我们之前的示例:
// ES5 $("#confetti-btn").click(function (event) { playTrumpet(); fireConfettiCannon(); });
这是它们在ES6中看起来的样子:
// ES6 $("#confetti-btn").click(event => { playTrumpet(); fireConfettiCannon(); });
这是一个微小的改进,对于使用了Promises的代码来说箭头函数的效果可以变得更加戏剧性,
}).then(function (result) {
这样的一行代码可以堆积起来。注意,使用了块语句的箭头函数不会自动返回值,你需要使用
return
语句将所需值返回。小提示:当使用箭头函数创建普通对象时,你总是需要将对象包裹在小括号里。
// 为与你玩耍的每一个小狗创建一个新的空对象 var chewToys = puppies.map(puppy => {}); // 这样写会报Bug! var chewToys = puppies.map(puppy => ({})); //
用小括号包裹空对象就可以了。
不幸的是,一个空对象
{}
和一个空的块{}
看起来完全一样。ES6中的规则是,紧随箭头的{被解析为块的开始,而不是对象的开始。因此,puppy => {}
这段代码就被解析为没有任何行为并返回undefined
的箭头函数。