技术

【填坑日记】ES6的新语法用ES5怎么写?find、findIndex源码来了

微信扫一扫,分享到朋友圈

【填坑日记】ES6的新语法用ES5怎么写?find、findIndex源码来了
收藏 0 0

ES6风风火火了来了,好多新语法,兴高采烈的学起来。用到了最新项目中,好死不死的发现,业务那边用的浏览器是chrome44,好多新语法的支持是从45开始的,你说郁闷不郁闷。虽然说是可以用过babelrc来提升解析的版本,不过又要处理各种的版本差异,乱起八糟的。当然完美的方案是通过自动化程序来处理,不过短期紧急修复的bug等等,直接将没有的语句语法糖贴上,还是很快速的。

Find

arr.find(callback[, thisArg]) 在数组中查找指定的元素并返回对应值。源码如下:

if (!Array.prototype.find) {
  Array.prototype.find = function(predicate) {
    'use strict';
    if (this == null) {
      throw new TypeError('Array.prototype.find called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;
 
    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return value;
      }
    }
    return undefined;
  };
}

 

FindIndex

arr.findIndex(callback[, thisArg]) 同上,返回对应的index

if (!Array.prototype.findIndex) {
  Array.prototype.findIndex = function(predicate) {
    'use strict';
    if (this == null) {
      throw new TypeError('Array.prototype.findIndex called on null or undefined');
    }
    if (typeof predicate !== 'function') {
      throw new TypeError('predicate must be a function');
    }
    var list = Object(this);
    var length = list.length >>> 0;
    var thisArg = arguments[1];
    var value;
 
    for (var i = 0; i < length; i++) {
      value = list[i];
      if (predicate.call(thisArg, value, i, list)) {
        return i;
      }
    }
    return -1;
  };
}

 

forEach

arr.forEach(callback[, thisArg]) 新的数组遍历

// Production steps of ECMA-262, Edition 5, 15.4.4.18
// Reference: http://es5.github.io/#x15.4.4.18
if (!Array.prototype.forEach) {
 
  Array.prototype.forEach = function(callback, thisArg) {
 
    var T, k;
 
    if (this === null) {
      throw new TypeError(' this is null or not defined');
    }
 
    // 1. Let O be the result of calling toObject() passing the
    // |this| value as the argument.
    var O = Object(this);
 
    // 2. Let lenValue be the result of calling the Get() internal
    // method of O with the argument "length".
    // 3. Let len be toUint32(lenValue).
    var len = O.length >>> 0;
 
    // 4. If isCallable(callback) is false, throw a TypeError exception. 
    // See: http://es5.github.com/#x9.11
    if (typeof callback !== "function") {
      throw new TypeError(callback + ' is not a function');
    }
 
    // 5. If thisArg was supplied, let T be thisArg; else let
    // T be undefined.
    if (arguments.length > 1) {
      T = thisArg;
    }
 
    // 6. Let k be 0
    k = 0;
 
    // 7. Repeat, while k < len
    while (k < len) {
 
      var kValue;
 
      // a. Let Pk be ToString(k).
      //    This is implicit for LHS operands of the in operator
      // b. Let kPresent be the result of calling the HasProperty
      //    internal method of O with argument Pk.
      //    This step can be combined with c
      // c. If kPresent is true, then
      if (k in O) {
 
        // i. Let kValue be the result of calling the Get internal
        // method of O with argument Pk.
        kValue = O[k];
 
        // ii. Call the Call internal method of callback with T as
        // the this value and argument list containing kValue, k, and O.
        callback.call(T, kValue, k, O);
      }
      // d. Increase k by 1.
      k++;
    }
    // 8. return undefined
  };
}

 

展开阅读全文
半拉子前端的自留地,发际线逐渐后移的抠脚大叔!

Webpack插件: Copy Webpack Plugin插件

上一篇

音乐可视化-Web Audio Api接口,AudioContext对象

下一篇

你也可能喜欢

发表评论

您的电子邮件地址不会被公开。 必填项已用 * 标注

提示:点击验证后方可评论!

插入图片

体验小程序

标签地图

分类

EA PLAYER &

历史记录 [ 注意:部分数据仅限于当前浏览器 ]清空

      00:00/00:00

      微信扫一扫

      微信扫一扫