zoukankan      html  css  js  c++  java
  • 数组的每个方法及源码实现

    https://blog.csdn.net/cmchenmei/article/details/79895554

    数组常用的 函数 方法
    var arr = [1,2,3,4]
    arr.length = 2;//修改数组的长度为 2 ,则下标为 >= 的元素被自动从数组移除
    console.log(arr)//[1,2]
    1
    2
    3
    可改变元素组方法:

    push 往数组的的最后面添加元素,返回添加完成之后数组的长度
    var arr = [1,2,3,4,5];
    var l = arr.push(0);
    console.log(arr);//[1, 2, 3, 4, 5, 0]
    console.log(l);//6
    1
    2
    3
    4
    push原型方法:

    Array.prototype.push = function(){
    for(var i = 0;i<arguments.length;i++){
    this[this.length] = arguments[i]
    }
    return this.length;
    }
    1
    2
    3
    4
    5
    6
    unshift 往前面加,也返回添加后数组的长度
    var l = arr.unshift(0, "aa");
    console.log(arr)//[0, "aa", 1, 2, 3, 4, 5, 0]
    console.log(l);//8
    1
    2
    3
    unshift 原型方法:

    Array.prototype.unshift = function(){
    var array = [];
    for(var i = 0;i<arguments.length;i++){
    array[i] = arguments[i];
    }
    for(var i = 0;i<this.length;i++){
    array[array.length] = this[i];
    }
    for(var i = 0;i<array.length;i++){
    this[i] = array[i];
    }
    return this.length;
    }
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    pop 从数组的最后去除掉一个元素, 返回被去除的那个元素
    var l = arr.pop();
    console.log(arr)//[0, "aa", 1, 2, 3, 4, 5]
    console.log(l);//0
    1
    2
    3
    shift 从数组的最前面去除一个元素,返回被去除的那个元素
    var l = arr.shift();
    console.log(arr)//["aa", 1, 2, 3, 4, 5]
    console.log(l);//0
    1
    2
    3
    reverse 将数组中的元素顺序翻转
    var arr = [1,2,3,4,5,6]
    arr.reverse();
    console.log(arr);//[6, 5, 4, 3, 2, 1]
    1
    2
    3
    4
    sort 数组排序 改变元素组
    var arr = [1,8,3,4,5,6,0]
    arr.sort() // [0,1,3,4,5,6,8] 默认是升序排列
    arr.sort(function(a,b){
    return a-b
    })
    1
    2
    3
    4
    5
    splice 在数组中删除从开始索引后的几个元素,并且在删除的位置添加指定的元素
    splice(index,length,target)
    index = index > 0 ? 0 : this.length-1;
    length = 0 //表示在第index位插入target
    var arr = [1,2,3,4,5];
    var res = arr.splice(2, 1, ["a", "b"]); // [1,2, ["a", "b"],4,5]
    console.log(arr);//[1, 2, Array(2), 4, 5]
    console.log(res);//[3]
    1
    2
    3
    4
    5
    6
    7
    不改变元素组方法:

    // slice 接收两个参数,一个起始(包括),一个结束(不包括)
    // 参数为负的时候,表示倒数索引(从-1开始数)
    // 只穿一个参数,表示从那个位置开始一直截到结束
    var arr = [1,2,3,4,5];
    var res = arr.slice(1, -1);
    console.log(res);////[2, 3, 4]
    console.log(arr)// [1, 2, 3, 4, 5]不改变元数组

    // concat 主要用于将两个数组连接在一起
    var arr = [1,2]; //不改变元数组
    var res = arr.concat([1],[2],[3],[3,4,5]);
    console.log(res);//[1, 2, 1, 2, 3, 3, 4, 5]


    // join 将数组元素用指定的字符串连接起来,并把结果返回
    var arr = [1,2,3,4,5,6]
    var res = arr.join("--");
    console.log(res);//1--2--3--4--5--6
    var res1 = arr.join("");
    console.log(res1);//123456

    //toString 将数组转换为字符串:
    var arr = [1,2,3,4,5,6]
    var res = arr.toString();//相当于res = String(arr)
    console.log(arr);//[1, 2, 3, 4, 5, 6]
    console.log(res);//1,2,3,4,5,6


    //map
    //把数组每个元素前两个字母以大写格式输出;
    var arr = ["ads","bdt","eft","dyu"];
    var f = function(x){
    return x.slice(0,2).toUpperCase();
    }
    var res = arr.map(f);
    console.log(res);//["AD", "BD", "EF", "DY"]

    var arr = ["def","ijh","hfg","jdej"];
    var res1 = arr.map(function(x){
    return x.substring(0,1).toUpperCase();
    });
    console.log(res1)// ["D", "I", "H", "J"];

    //filter 返回true 舍弃false
    var arr = [1,2,3,30,20,2,34];
    var res = arr.filter(function(val,index){
    return val>10
    })
    console.log(res)//[30,20,34]

    //reduce 对数组中的所有元素调用指定的回调函数。该回调函数的返回值为累积结果,并且此返回值在下一次调用该回调函数时作为参数提供。
    var arr = [2,3,4];
    var res = arr.reduce(function(x,y){
    return x+y //5 9
    }); //9

    var res = arr.reduce(function(x,y){
    return x*y
    }); //24
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    以下面这个数组为例:

    var personArr = [
    {name:'邓哥',src:'./img/1.jpg',des:'颈椎不好',sex:'f'},
    {name:'成哥',src:'./img/2.jpg',des:'说',sex:'m'},
    {name:'冰洁',src:'./img/3.jpg',des:'美',sex:'f'},
    {name:'胖子',src:'./img/4.jpg',des:'胖',sex:'m'}
    ];
    1
    2
    3
    4
    5
    6
    1.forEach

    Array.prototype.myForeach = function(func){
    for(var i = 0;i<this.length;i++){
    func(this[i],i)
    }
    }
    personArr.myForeach(function(el,index){
    console.log(el.name)
    })
    1
    2
    3
    4
    5
    6
    7
    8
    2.filter

    Array.prototype.myFilter = function(func){
    var newArray = []
    for(var i = 0;i<this.length;i++){
    if(func(this[i],i)){
    newArray.push(this[i])
    }
    }
    return newArray;
    }
    console.log(personArr.myFilter(function(el,index){
    if(el.sex == 'f'){
    return true
    }
    }))
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    3.map

    Array.prototype.myMap = function(func){
    for(var i = 0;i<this.length;i++){
    this[i] = func(this[i],i);
    }
    return this
    }

    var arr = [1,2,3,4,5];
    var newArr = arr.myMap(function(el,index){
    return el + 2
    })
    console.log(newArr)
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    4.reduce

    Array.prototype.myReduce = function(func,init){
    var pre = this[0],
    i = 1;
    //判断有没有传入初始值
    if(init){
    pre = init;
    i = 0;
    }
    while(i < this.length){
    pre = func(pre,this[i],i);
    i ++;
    }
    return pre;
    }
    var arr = [1,2,3,4,5,1,1];
    var newAr = arr.myReduce(function(a,b,index){
    return a + b
    })
    console.log(newAr)
    ---------------------
    作者:cm_xuan77
    来源:CSDN
    原文:https://blog.csdn.net/cmchenmei/article/details/79895554
    版权声明:本文为博主原创文章,转载请附上博文链接!

  • 相关阅读:
    LeetCode 12. Integer to Roman
    个人博客09
    个人博客08
    人机交互之我的输入法
    学习进度条(第六周)
    《梦断代码》阅读笔记02
    个人博客07
    学习进度条(第五周)
    个人博客06
    个人博客05
  • 原文地址:https://www.cnblogs.com/chaoyuehedy/p/10071295.html
Copyright © 2011-2022 走看看