Javascript 数组方法兼容性写法 indexOf()、forEach()、map()、filter()、some()、every()、find()、findIndex()、copyWithin()、includes()、reduce()

分类 javascript 71阅读阅读模式

indexOf()、forEach()、map()、filter()、some()、every()、find()、findIndex()、copyWithin()、includes()、reduce() 等兼容性写法汇总。

 

indexOf()

indexOf()方法 返回根据给定元素找到的第一个索引值,否则返回-1。

  1. // indexOf()
  2. if (!Array.prototype.indexOf) {
  3.   Array.prototype.indexOf = function(ele) {
  4.     // 获取数组长度
  5.     var len = this.length;
  6.     // 检查值为数字的第二个参数是否存在,默认值为0
  7.     var fromIndex = Number(arguments[1]) || 0;
  8.     // 当第二个参数小于0时,为倒序查找,相当于查找索引值为该索引加上数组长度后的值
  9.     if (fromIndex < 0) {
  10.       fromIndex += len;
  11.     }
  12.     // 从fromIndex起循环数组
  13.     while (fromIndex < len) {
  14.       // 检查fromIndex是否存在且对应的数组元素是否等于ele
  15.       if (fromIndex in this && this[fromIndex] === ele) {
  16.         return fromIndex;
  17.       }
  18.       fromIndex++;
  19.     }
  20.     // 当数组长度为0时返回不存在的信号:-1
  21.     if (len === 0) {
  22.       return -1;
  23.     }
  24.   };
  25. }

 

forEach()

forEach() 方法让数组的每一项都执行一次给定的函数。forEach() 方法会修改原数组。

  1. // forEach()
  2. if (!Array.prototype.forEach) {
  3.   Array.prototype.forEach = function forEach(callback) {
  4.     // 获取数组长度
  5.     var len = this.length;
  6.     if (typeof callback != "function") {
  7.       throw new TypeError();
  8.     }
  9.     // thisArg为callback 函数的执行上下文环境
  10.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  11.     for (var i = 0; i < len; i++) {
  12.       if (i in this) {
  13.         // callback函数接收三个参数:当前项的值、当前项的索引和数组本身
  14.         callback.call(thisArg, this[i], i, this);
  15.       }
  16.     }
  17.   };
  18. }

 

map()

map() 方法返回一个由原数组中的每个元素调用一个指定方法后的返回值组成的新数组。map() 被调用时不会改变数组。

  1. if (!Array.prototype.map) {
  2.   Array.prototype.map = function(callback) {
  3.     // 获取数组长度
  4.     var len = this.length;
  5.     if (typeof callback != "function") {
  6.       throw new TypeError();
  7.     }
  8.     // 创建跟原数组相同长度的新数组,用于承载经回调函数修改后的数组元素
  9.     var newArr = new Array(len);
  10.     // thisArg为callback 函数的执行上下文环境
  11.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  12.     for (var i = 0; i < len; i++) {
  13.       if (i in this) {
  14.         newArr[i] = callback.call(thisArg, this[i], i, this);
  15.       }
  16.     }
  17.     return newArr;
  18.   };
  19. }

 

filter()

filter() 方法利用所有通过指定函数测试的元素创建一个新的数组,并返回。filter() 被调用时不会改变数组。

  1. if (!Array.prototype.filter) {
  2.   Array.prototype.filter = function(callback) {
  3.     // 获取数组长度
  4.     var len = this.length;
  5.     if (typeof callback != "function") {
  6.       throw new TypeError();
  7.     }
  8.     // 创建新数组,用于承载经回调函数修改后的数组元素
  9.     var newArr = new Array();
  10.     // thisArg为callback 函数的执行上下文环境
  11.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  12.     for (var i = 0; i < len; i++) {
  13.       if (i in this) {
  14.         if (callback.call(thisArg, this[i], i, this)) {
  15.           newArr.push(val);
  16.         }
  17.       }
  18.     }
  19.     return newArr;
  20.   };
  21. }

 

some()

some() 方法测试数组中的某些元素是否通过了指定函数的测试。返回布尔值。some() 被调用时不会改变数组。

  1. if (!Array.prototype.some) {
  2.   Array.prototype.some = function(callback) {
  3.     // 获取数组长度
  4.     var len = this.length;
  5.     if (typeof callback != "function") {
  6.       throw new TypeError();
  7.     }
  8.     // thisArg为callback 函数的执行上下文环境
  9.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  10.     for (var i = 0; i < len; i++) {
  11.       if (i in this && callback.call(thisArg, this[i], i, this)) {
  12.         return true;
  13.       }
  14.     }
  15.     return false;
  16.   };
  17. }

 

every()

every() 方法测试数组的所有元素是否都通过了指定函数的测试。every() 不会改变原数组。

  1. if (!Array.prototype.every) {
  2.   Array.prototype.every = function(callback) {
  3.     // 获取数组长度
  4.     var len = this.length;
  5.     if (typeof callback != "function") {
  6.       throw new TypeError();
  7.     }
  8.     // thisArg为callback 函数的执行上下文环境
  9.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  10.     for (var i = 0; i < len; i++) {
  11.       if (i in this && !callback.call(thisArg, this[i], i, this)) {
  12.         return false;
  13.       }
  14.     }
  15.     return true;
  16.   };
  17. }

 

find()

find() 方法返回数组中满足提供的测试函数的第一个元素的值。否则返回 undefined。

  1. if (!Array.prototype.find) {
  2.   Array.prototype.find = function(callback) {
  3.     if (this == null) {
  4.       throw new TypeError('"this" is null or not defined');
  5.     }
  6.     if (typeof callback != "function") {
  7.       throw new TypeError();
  8.     }
  9.     var o = Object(this);
  10.     var len = o.length >>> 0;
  11.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  12.     var k = 0;
  13.     while (k < len) {
  14.       var kValue = o[k];
  15.       if (callback.call(thisArg, kValue, k, o)) {
  16.         return kValue;
  17.       }
  18.       k++;
  19.     }
  20.     return undefined;
  21.   };
  22. }

 

findIndex()

findIndex()方法返回数组中满足提供的测试函数的第一个元素的索引。否则返回-1。

  1. if (!Array.prototype.findIndex) {
  2.   Array.prototype.findIndex = function(callback) {
  3.     if (this == null) {
  4.       throw new TypeError('"this" is null or not defined');
  5.     }
  6.     if (typeof callback != "function") {
  7.       throw new TypeError();
  8.     }
  9.     var o = Object(this);
  10.     var len = o.length >>> 0;
  11.     var thisArg = arguments.length >= 2 ? arguments[1] : void 0;
  12.     var k = 0;
  13.     while (k < len) {
  14.       var kValue = o[k];
  15.       if (callback.call(thisArg, kValue, k, o)) {
  16.         return k;
  17.       }
  18.       k++;
  19.     }
  20.     return -1;
  21.   };
  22. }

 

copyWithin()

copyWithin() 方法浅复制数组的一部分到同一数组中的另一个位置,并返回它,而不修改其大小。

  1. if (!Array.prototype.copyWithin) {
  2.   Array.prototype.copyWithin = function(target, start /*, end*/ ) {
  3.     if (this == null) {
  4.       throw new TypeError('this is null or not defined');
  5.     }
  6.     var O = Object(this);
  7.     var len = O.length >>> 0;
  8.     var relativeTarget = target >> 0;
  9.     var to = relativeTarget < 0 ? Math.max(len + relativeTarget, 0) : Math.min(relativeTarget, len);
  10.     var relativeStart = start >> 0;
  11.     var from = relativeStart < 0 ? Math.max(len + relativeStart, 0) : Math.min(relativeStart, len);
  12.     var end = arguments[2];
  13.     var relativeEnd = end === undefined ? len : end >> 0;
  14.     var final = relativeEnd < 0 ? Math.max(len + relativeEnd, 0) : Math.min(relativeEnd, len);
  15.     var count = Math.min(final - from, len - to);
  16.     var direction = 1;
  17.     if (from < to && to < (from + count)) {
  18.       direction = -1;
  19.       from += count - 1;
  20.       to += count - 1;
  21.     }
  22.     while (count > 0) {
  23.       if (from in O) {
  24.         O[to] = O[from];
  25.       } else {
  26.         delete O[to];
  27.       }
  28.       from += direction;
  29.       to += direction;
  30.       count--;
  31.     }
  32.     return O;
  33.   };
  34. }

 

 

includes()

includes() 方法用来判断一个数组是否包含一个指定的值,根据情况,如果包含则返回 true,否则返回false。

  1. if (!Array.prototype.includes) {
  2.   Array.prototype.includes = function(searchElement, fromIndex) {
  3.     if (this == null) {
  4.       throw new TypeError('"this" is null or not defined');
  5.     }
  6.     var o = Object(this);
  7.     var len = o.length >>> 0;
  8.     if (len === 0) {
  9.       return false;
  10.     }
  11.     var n = fromIndex | 0;
  12.     var k = Math.max(n >= 0 ? n : len - Math.abs(n), 0);
  13.     while (k < len) {
  14.       if (o[k] === searchElement) {
  15.         return true;
  16.       }
  17.       k++;
  18.     }
  19.     return false;
  20.   };
  21. }

 

reduce()

reduce() 方法对数组中的每个元素执行一个由您提供的reducer函数(升序执行),将其结果汇总为单个返回值。

  1. if (!Array.prototype.reduce) {
  2.   Array.prototype.reduce = function(callback /*, initialValue*/ ) {
  3.     if (this == null) {
  4.       throw new TypeError('"this" is null or not defined');
  5.     }
  6.     if (typeof callback != "function") {
  7.       throw new TypeError();
  8.     }
  9.     var o = Object(this);
  10.     var len = o.length >>> 0;
  11.     var k = 0;
  12.     var value;
  13.     if (arguments.length >= 2) {
  14.       value = arguments[1];
  15.     } else {
  16.       while (k < len && !(k in o)) {
  17.         k++;
  18.       }
  19.       if (k >= len) {
  20.         throw new TypeError('Reduce of empty array ' + 'with no initial value');
  21.       }
  22.       value = o[k++];
  23.     }
  24.     while (k < len) {
  25.       if (k in o) {
  26.         value = callback(value, o[k], k, o);
  27.       }
  28.       k++;
  29.     }
  30.     return value;
  31.   };
  32. }

 

 

相关文章

给我留言

  • 有人回复时邮件通知我