本系列文章中,对forEach、filter、map、every、some、reduce和reduceRight等函数,讲述了如何自己编写代码实现它们的功能。
通过阅读源码,自己编写源码,能了解编写思想、熟悉设计模式,能锻炼自己编写组件、框架的能力。
接上篇文章内容,这里继续讨论如何封装自己的map、every、some函数。
实现map 源码编写
map() 方法的作用是:返回一个新数组,数组中的元素为原始数组元素调用函数处理后的值。map() 方法按照原始数组的元素顺序依次处理元素。
map方法翻译叫做“映射”,但这个翻译个人觉得不准确。它的基本用法跟forEach方法类似。
注意:
- map() 不会对空数组进行检测。
- map() 不会改变原始数组。
其语法规则为:
array.map(function(currentValue,index,arr), thisValue)
名词解释:
- currentValue 必选。当前元素的值
- index 可选。当前元素的索引值
- arr 可选。当前元素属于的数组对象
- thisValue 可选。对象作为该执行回调时使用,传递给函数,用作 “this” 的值。
源码编写
Array.prototype.myMap = function (func) {
var arr = [];
var len = this.length;
var _this = arguments[1] || window;
for (var i = 0; i < len; i++) {
arr.push(func.apply(_this, [this[i], i, this]));
}
return arr;
};
实现every 和 some源码编写
every()和some()方法的作用很简单,前者是全真才为真,一假则为假,后者则是一真则真,全假则为假。
every() 方法:用于检测数组所有元素是否都符合指定条件(条件通过函数提供),使用指定的函数检测数组中的所有元素:
- 如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
- 如果所有元素都满足条件,则返回 true。
注意
- every() 不会对空数组进行检测。
- every() 不会改变原始数组。
它的语法规则为:
array.every(function(currentValue,index,arr), thisValue)
源码编写如下,都有用到apply函数来改变this指向:
Array.prototype.myevery = function (func) {
var flag = true;
var len = this.length;
var _this = arguments[1] || window;
for (var i = 0;i < len; i++){
if(func.apply(_this,[this[i],i,this]) == false){
flag = false;
break;
}
}
return flag;
};
some()方法:方法用于检测数组中的元素是否满足指定条件(函数提供)。它会依次执行数组的每个元素:
- 如果有一个元素满足条件,则表达式返回true, 剩余的元素不会再执行检测。
- 如果没有满足条件的元素,则返回false。
总结下来就是 :一真则真,全假则为假。
所以其源码就相对于every做一点小变动就行了:
Array.prototype.mySome = function (func) {
var flag = false;
var len =this.length;
var _this = arguments[1];
for (var i = 0;i < len;i ++){
if (func.apply(_this,[this[i],i,this]) == true){
flag = true;
break;
}
}
return flag;
};
三个数组方法源码编写如上,供参考。