这里定义新的方法,实现数组遍历方法的基本功能,话不多说,看代码

手写方法,实现数组遍历方法的基本原理

● forEach

● map

highlight: agate theme: smartblue

这里定义新的方法,实现数组遍历方法的基本功能,话不多说,看代码

手写方法,实现数组遍历方法的基本原理

● forEach

● map

● filter

● find

● findIndex

● every

● some

● reduce

1.定义一个myForeach,功能和forEach一模一样

 const arr=[5,8,2,1,5]
 //往数组原型对象中加myForeach方法
 Array.prototype.myForeach = function(fn){
                for(let i=0;i<this.length;i++){
                    fn(this[i],i,this)
               }
}
            arr.myForeach(function(item,index,arr){
                console.log(item,index,arr);
            })

2.定义一个myMap方法,功能和map功能一样

 const arr=[1,2,3,4,5]
 //往数组原型对象中加myMap方法
           Array.prototype.myMap = function(fn){
               let a2=[]
                for(let i=0;i<this.length;i++){
                    a2.push(fn(this[i],i,this))
                }
                return a2
             }
            const newarr=arr.myMap(function(item,index,arr){
                 console.log(item);
                return `<p>${item}<p>`
             })

3.定义一个myFilter方法,功能和filter一样

const arr=[12,101,2,3,4,5]
//往数组原型对象中加myFilter方法
            Array.prototype.myFilter = function(fn){
                let newarr=[]
                for(let i=0;i<this.length;i++){
                    if(fn(this[i])){
                        newarr.push(this[i])
                    }
                }
                return newarr
            }

            const RESULT=arr.myFilter(function(item){
                return item<12
            })
            console.log(RESULT);

4.实现myFind/myFindIndex方法,功能和find/findIndex一样

const arr = [
                { id: 8, name: 'b' },
                { id: 5, name: 'c' },
                { id: 1, name: 'a' },
            ];
//往数组原型对象中加newFind方法
            Array.prototype.newFind = function (fn) {
                for(let i=0; i<arr.length; i++) {
                    if(fn(this[i],i)){
                        return this[i];
                    }
                }
            };

            const result= arr.newFind(function (item,index) {
                return item.id === 5;
            });
            console.log(result);


            //往数组原型对象中加newFindIndex方法
            Array.prototype.newFindIndex = function (fn) {
                for(let i=0; i<arr.length; i++) {
                    if(fn(this[i],i)){
                        return i
                    }
                }
                return -1
            }

            const result1= arr.newFindIndex(function (item,index) {
                return item.id === 10;
            });

            console.log(result1);

5.实现myEvery/mySome方法,功能和every/mySome一样

const arr=[1,5,10,8,3]
//往数组原型对象中加myEvery方法
            Array.prototype.myEvery = function (fn) {
                for(let i=0;i<arr.length;i++) {
                    if(!fn(this[i])){
                        return false
                    }
                }
                return true

            }

            const result=arr.myEvery(function(item){
                return item<15
            })
            console.log(result);
//往数组原型对象中加mySome方法
            Array.prototype.mySome= function (fn) {
                for(let i=0;i<arr.length;i++) {
                    if(fn(this[i])){
                        return true
                    }
                }
                return false

            }

            const result1=arr.mySome(function(item){
                return item<5
            })
            console.log(result1);

6.实现myReduce方法,功能和reduce一样

const arr = [1, 5, 10, 8, 3];
//往数组原型对象中加myReduce方法
            Array.prototype.myReduce = function (fn,total) {
                
                for(let i=0;i<this.length;i++) {
                    
                    total=fn(total,this[i]);
                }
                return total;
            };
            const result=arr.myReduce(function (sum,next) {
                return sum+next
            },0);

            console.log(result);

最后感谢大家观看 ● filter

● find

● findIndex

● every

● some

● reduce

1.定义一个myForeach,功能和forEach一模一样

 const arr=[5,8,2,1,5]
 //往数组原型对象中加myForeach方法
 Array.prototype.myForeach = function(fn){
                for(let i=0;i<this.length;i++){
                    fn(this[i],i,this)
               }
}
            arr.myForeach(function(item,index,arr){
                console.log(item,index,arr);
            })

2.定义一个myMap方法,功能和map功能一样

 const arr=[1,2,3,4,5]
 //往数组原型对象中加myMap方法
           Array.prototype.myMap = function(fn){
               let a2=[]
                for(let i=0;i<this.length;i++){
                    a2.push(fn(this[i],i,this))
                }
                return a2
             }
            const newarr=arr.myMap(function(item,index,arr){
                 console.log(item);
                return `<p>${item}<p>`
             })

3.定义一个myFilter方法,功能和filter一样

const arr=[12,101,2,3,4,5]
//往数组原型对象中加myFilter方法
            Array.prototype.myFilter = function(fn){
                let newarr=[]
                for(let i=0;i<this.length;i++){
                    if(fn(this[i])){
                        newarr.push(this[i])
                    }
                }
                return newarr
            }

            const RESULT=arr.myFilter(function(item){
                return item<12
            })
            console.log(RESULT);

4.实现myFind/myFindIndex方法,功能和find/findIndex一样

const arr = [
                { id: 8, name: 'b' },
                { id: 5, name: 'c' },
                { id: 1, name: 'a' },
            ];
//往数组原型对象中加newFind方法
            Array.prototype.newFind = function (fn) {
                for(let i=0; i<arr.length; i++) {
                    if(fn(this[i],i)){
                        return this[i];
                    }
                }
            };

            const result= arr.newFind(function (item,index) {
                return item.id === 5;
            });
            console.log(result);


            //往数组原型对象中加newFindIndex方法
            Array.prototype.newFindIndex = function (fn) {
                for(let i=0; i<arr.length; i++) {
                    if(fn(this[i],i)){
                        return i
                    }
                }
                return -1
            }

            const result1= arr.newFindIndex(function (item,index) {
                return item.id === 10;
            });

            console.log(result1);

5.实现myEvery/mySome方法,功能和every/mySome一样

const arr=[1,5,10,8,3]
//往数组原型对象中加myEvery方法
            Array.prototype.myEvery = function (fn) {
                for(let i=0;i<arr.length;i++) {
                    if(!fn(this[i])){
                        return false
                    }
                }
                return true

            }

            const result=arr.myEvery(function(item){
                return item<15
            })
            console.log(result);
//往数组原型对象中加mySome方法
            Array.prototype.mySome= function (fn) {
                for(let i=0;i<arr.length;i++) {
                    if(fn(this[i])){
                        return true
                    }
                }
                return false

            }

            const result1=arr.mySome(function(item){
                return item<5
            })
            console.log(result1);

6.实现myReduce方法,功能和reduce一样

const arr = [1, 5, 10, 8, 3];
//往数组原型对象中加myReduce方法
            Array.prototype.myReduce = function (fn,total) {
                
                for(let i=0;i<this.length;i++) {
                    
                    total=fn(total,this[i]);
                }
                return total;
            };
            const result=arr.myReduce(function (sum,next) {
                return sum+next
            },0);

            console.log(result);