一、用ES5实现数组的map方法

核心要点

1.回调函数的参数有哪些,返回值如何处理。

2.不修改原来的数组。

 /*
 var new_array = arr.map(function callback(currentValue[, index[, array]]) {
  // Return element for new_array
 }[, thisArg])
 */
 
 Array.prototype.myMap = function (fn, context) {
   let arr = Array.prototype.slice.call(this);
   let res = [];
   for (let i = 0; i < arr.length; i++) {
     res.push(fn.call(context, arr[i], i, arr));
   }
   return res;
 }

二、用ES5实现数组的reduce方法(累加器)

核心要点

1、初始值不传怎么处理

2、回调函数的参数有哪些,返回值如何处理。

 // array.reduce(function(total, currentValue, currentIndex, arr), initialValue)
 Array.prototype.myReduce = function(fn, initialValue) {
   let arr = Array.prototype.slice.call(this);
   let total = initialValue ? initialValue : arr[0];
   let startIndex = initialValue ? 0 : 1;
   for (let i = startIndex; i < arr.length; i++) {
     total = fn.call(null, total, arr[i], i, this);
   }
   return total;
 }

【引申】用ES5实现数组的reduceRight方法

 Array.prototype.myReduceRight = function(fn, initialValue) {
   let arr = Array.prototype.slice.call(this);
   let len = arr.length;
   let total = initialValue ? initialValue : arr[len-1];
   let startIndex = initialValue ? len-1 : len-2;
   for (let i = startIndex; i >= 0; i--) {
     total = fn.call(null, total, arr[i], i, this);
   }
   return total;
 }

三、实现call/apply

思路: 利用this的上下文特性。

 // function.call(thisArg, arg1, arg2, ...)
 Function.prototype.myCall = function(context, ...args) {
   let func = this;
   let fn = Symbol('fn');
   context[fn] = func;
   let res = context[fn](...args);
   delete context[fn];
   return res;
 }
 
 Function.prototype.myApply = function(context, args) {
   let func = this;
   let fn = Symbol('fn');
   context[fn] = func;
   let res = context[fn](...args);
   delete context[fn];
   return res;
 }

四、实现Object.create方法(常用)

**Object.create()**方法创建一个新对象,使用现有的对象来提供新创建的对象的__proto__

 // Object.create(proto[, propertiesObject])
 Object.myCreate = function(proto) {
   function F(){}
   F.prototype = proto;
   // F.prototype.constructor = F;
   return new F();
 }

五、实现bind方法

核心要点