手写原生方法

1. forEach方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'}
];
 Array.prototype.my_forEach = function(callback) {
     for(var i =0; i < this.length; i++){
         callback(i,this[i], this);
     }
 }
 
 arr.my_forEach((index, item, Array)=> {
     item.name = 'test';
 })
 
console.log(arr);
 
result:
let arr = [
    {name: 'test'，age: '21'},
    {name: 'test'，age: '22'},
    {name: 'test'，age: '23'},
    {name: 'test'，age: '24'}
];

2. map方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'}
];

Array.prototype.my_map = function(callback){
    let list = [];
    for(var i = 0; i<this.length; i++){
        list.push(callback(i, this[i],this));
    }
    return list;
}

arr = arr.my_map((index, item, Array)=> {
    return item.name+'a'
})

console.log(arr)

result:
let arr = ['大大a','欢欢a','泡泡a','等等a'];

3. filter方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'}
];
Array.prototype.my_filter = function(callback) {
    let list = [];
    for(let i =0; i < this.length; i++){
        callback(i,this[i], this) && list.push(this[i])
    }
    return list;
}

arr = arr.my_filter((index, item, array)=>{
    return item.age == '21'
});
console.log(arr)
result:
arr = [{name: '大大',age: '21'}]

4. every方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'}
];
Array.prototype.my_every = function(callback){
    let flag;
    for(let i =0; i< this.length; i++){
        flag = callback(i, this[i], this)
        !flag && break;
    }
    return !!flag;
}
let myflag = arr.my_every((index, item, array)=>{
    return item.age === '23'
})
console.log(myflag);
result: false

let arr1 = [
    {name: '大大',age: '23'},
    {name: '欢欢',age: '23'},
    {name: '泡泡',age: '23'},
];
let myflag1 = arr1.my_every((index, item, array)=>{
    return item.age === '23'
})
console.log(myflag1);
result: true

5. some方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'}
];
Array.prototype.my_some = function(callback){
    let flag;
    for(let i =0;i< this.length;i++){
        flag = callback(i, this[i], this)
        if(flag){
            break;
        }
    }
    return flag;
}

let flag = arr.my_some((index, item, array) => {
    return item.name === '大大'
})

console.log(flag)
result: true

let flag1 = arr.my_some((index, item, array) => {
    return item.name === '122'
})

console.log(flag1)
result: false

6. fill方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'}
];

Array.prototype.my_fill = function(callback){
    let list = [];
    for(let i =0;i< this.length;i++){
        list.push(callback(i,this[i], this))
    }
    return list;
}

arr = arr.my_fill((index, item, array) => {
    return 111;
})

console.log(arr);

result:

arr = [111,111,111,111]

7. concat方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'}
];

Array.prototype.my_concat = function(item){
    let list = [];
    for(let i=0; i< this.length;i++){
        list.push(this[i])
    }
    let args = [].slice.call(arguments);
    for(let i=0; i< args.length;i++){
       if(Array.isArray(args[i])){
           for(let j=0; j<args[i].length;j++){
               list.push(args[i][j])
           }
       } else {
           list.push(args[i])
       }
    }
    
    return list;
}

arr = arr.my_concat(2,3,[4,[7],8]);
console.log(arr)
result:

arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'},
    2,3,4,[7],8
];

8. flat方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'},
    [3,4,[5]],
    [8,3]
];

Array.prototype.my_flat = function(){
let list = [];
for(let i=0; i< this.length;i++){
   if(Array.isArray(this[i])) {
       // es5写法
       list = list.concat(this[i])
       // es6写法
       list = [...list, ...this[i]]
   } else {
       list.push(this[i])
   }
}
return list;
}

arr = arr.flat();
console.log(arr);
result:
arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'},
    3,4,[5],8,3
];

9. includes方法

let arr = [2,3,NaN, null, {}, [], 'aa']

Array.prototype.my_includes = function(value, start = 0) {
    let flag;
    for(let i=start;i<this.length; i++){
      flag = value === this[i] || isNaN && Number.isNaN(value)
      if(flag == true) break;
    }
    return !!flag;
}

//isNaN 如果参数为非数字，会尝试将参数转为数字，在进行判断。Number.isNaN，责直接判断参数是否为NaN.

console.log(arr.my_includes('aa')); // true
console.log(arr.my_includes(2));// true
console.log(arr.my_includes('3'));// false
console.log(arr.my_includes(NaN));// true
console.log(arr.my_includes({}));// true

10. find方法

let arr = [
    {name: '大大',age: '21'},
    {name: '欢欢',age: '22'},
    {name: '泡泡',age: '23'},
    {name: '等等',age: '24'},
];

Array.prototype.my_find = function(callback){
    for(let i =0; i < this.length; i++) {
      if( callback(i, this[i], this)) return this[i];
    }
}

let arg = arr.my_find((index, item, array) => {
    return item.name === '等等'
});

console.log(arg);
result: 
{name: '等等',age: '24'},

11. join方法

let arr = ['2023','03', '24'];

Array.prototype.my_join = function(str=','){
    let value = '';
    for(let i=0;i<this.length;i++){
        value = i === 0? `${value}${this[i]}` : `${value}${str}${this[i]}` 
    }
    return value;
}

let strings = arr.join();
console.log(strings)
// '2023,03,24'
let strings = arr.join('-');
console.log(strings)
// '2023-03-24'

未完待续……