美文网首页
javascript 引用对象(Array对象)

javascript 引用对象(Array对象)

作者: 不懂如山 | 来源:发表于2018-03-27 22:59 被阅读0次

    Array对象的实例化方式
    方法一
    var colors = new Array(); //通过构造函数创建数组
    方法二
    var colors = new Array(20); //下面的代码将创建length值为20的数组
    方法三
    var colors = new Array("red", "blue", "green"); //向Array构造函数传递数组中应该包含的项
    方法四
    var names = ["red", "blue", "green"]; //使用中括号传递数组中应该包含的项

    1、Array对象的属性

    length属性:表示数组的长度
    var colors = new Array("red", "blue", "green");
    alert(colors.length); //数组的长度为3
    注意length属性不是只读的,可以通过给length属性赋值增加数组的长度

    因为数组的索引从0开始,可以通过length属性方便地在数组末端增加新项
    如下面的历程所示
    var colors = ["red", "blue", "green"]; // 创建一个包含3个字符串的数组
    colors[colors.length] = "black"; //(在位置3)添加一种颜色
    colors[colors.length] = "brown"; //(在位置4)再添加一种颜色

    2、数组检测
    检测一个变量是不是数组可以使用instanceof操作符
    var colors = ["red", "blue", "green"];
    if(colors instanceof Array){
    console.log('colors is Array');
    console.log(colors instanceof Array);
    }

    3、转换方式
    3.1
    可以通过继承于引用对象的方法将数组转化成字符串
    toLocaleString()
    toString()
    valueOf()
    其中toLocaleString(),toString()返回的是字符串,valueOf()返回的是数组
    var colors = ["red", "blue", "green"];

    console.log(colors.toString());//red,blue,green
    console.log(colors.toLocaleString());//red,blue,green
    console.log(colors.valueOf());//(3) ["red", "blue", "green"]

    console.log(typeof colors.toString()); //string
    console.log(typeof colors.toLocaleString());//string
    console.log(typeof colors.valueOf()); //Array

    3.2
    也可以使用数组的join()方法,将数组转化成字符串输出
    var colors = ["red", "green", "blue"];
    alert(colors.join(",")); //red,green,blue
    alert(colors.join("||")); //red||green||blue

    4数组操作
    4.1栈方法操作
    数组模仿栈操作(后入先出)
    push()方法(数组末插入)
    pop()方法(数组末删除)

    push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度。
    pop()方法则从数组末尾移除最后一项,减少数组的length值,然后返回移除的项。

    var colors = new Array(); // 创建一个数组
    var count = colors.push("red", "green"); // 推入两项
    alert(count); //2
    count = colors.push("black"); // 推入另一项
    alert(count); //3
    var item = colors.pop(); // 取得最后一项
    alert(item); //"black"
    alert(colors.length); //2

    4.2队列方法
    数组模仿队列操作(先入先出)
    push()方法(数组末插入)
    shift()方法(数组头删除)

    push()方法可以接收任意数量的参数,把它们逐个添加到数组末尾,并返回修改后数组的长度。
    shift()能够移除数组中的第一个项并返回该项,同时将数组长度减1。

    var colors = new Array();
    var count = colors.push("red", "green");
    alert(count);
    count = colors.push("black");
    alert(count);
    var item = colors.shift();
    alert(item);
    alert(colors.length);
    

    最后补充一个unshift()方法,作用和shifit()方法相反,即从头插入,返回值是数组的新长度

    4.3总结
    unshift()从头插入
    shift()从头删除
    push()从尾插入
    pop()从尾删除
    删除的函数返回删除的项,插入的函数返回插入的数组的新长度

    5数组排序
    5.1
    reverse()方法:使数组的排序反转
    var values = [1, 2, 3, 4, 5];
    values.reverse();
    alert(values); //5,4,3,2,1

    5.2
    sort()方法:sort方法一般需要传递一个比较函数的参数,根据比较函数的参数进行排序

    function compare(value1, value2) {
    if (value1 < value2) {
    return 1;
    } else if (value1 > value2) {
    return -1;
    } else {
    return 0;
    }
    }

    var values = [1, 2, 3, 4, 5];
    values.sort(compare);
    alert(values); //5,4,3,2,1

    比较函数还可以进一步研究

    6数组复制
    6.1concat()方法:参数是增加在数组后面的新项,返回值是一个包含增加项的新的数组,没有参数则返回数组的副本。

    var colors = ["red", "green", "blue"];
    var colors2 = colors.concat("yellow", ["black", "brown"]);
    alert(colors); //red,green,blue
    alert(colors2); //red,green,blue,yellow,black,brown

    6.2slice()方法:它能够基于当前数组中的一或多个项创建一个新数组。slice()方法可以接受一或两个参数,即要返回项的起始和结束位置。在只有一个参数的情况下,slice()方法返回从该参数指定位置开始到当前数组末尾的所有项。如果有两个参数,该方法返回起始和结束位置之间的项——但不包括结束位置的项。注意,slice()方法不会影响原始数组。

    var colors = ["red", "green", "blue", "yellow", "purple"];
    var colors2 = colors.slice(1);
    var colors3 = colors.slice(1,4);
    alert(colors2); //green,blue,yellow,purple
    alert(colors3); //green,blue,yellow

    6.3splice()方法:主要用于从数组中间插值
    splice (2,1,"red","green");
    splice (插入位置,要删除的项的个数,插入的具体值);

    6.4总结
    concat()和slice()都是返回新数组
    concat()是从后插入,或者不插入,形成数组副本
    slice()则是截取数组的部分,形成新数组
    splice()方法则会改变原数组,用于中间插值

    7位置方法
    indexOf()和lastIndexOf()

    var numbers = [1,2,3,4,5,4,3,2,1];
    alert(numbers.indexOf(4)); //3 表示从前往后数第一个4在数组中的索引是3
    alert(numbers.lastIndexOf(4)); //5 表示从后往前数第一个4在数组中的索引是5

    8函数式编程

    every():对数组中的每一项运行给定函数,如果该函数对每一项都返回true,则返回true。filter():对数组中的每一项运行给定函数,返回该函数会返回true的项组成的数组。
    forEach():对数组中的每一项运行给定函数。这个方法没有返回值。
    map():对数组中的每一项运行给定函数,返回每次函数调用的结果组成的数组。
    some():对数组中的每一项运行给定函数,如果该函数对任一项返回true,则返回true。

    reduce()和reduceRight()
    这两个方法都会迭代数组的所有项,然后构建一个最终返回的值。其中,reduce()方法从数组的第一项开始,逐个遍历到最后。而reduceRight()则从数组的最后一项开始,向前遍历到第一项。

    相关文章

      网友评论

          本文标题:javascript 引用对象(Array对象)

          本文链接:https://www.haomeiwen.com/subject/nefecftx.html