JavaScript基础-----数组（Array）

Posted 2020-11-19 hyi520

1.JavaScript 中创建数组的方法：

    （1）.使用Array构造函数：    

var arr = new Array();    //创建一个空数组
var arr = new Array(5);   //传递一个整数时，表示创建了一个长度为 5 的数组，如果传递一个字符串，则表示创建了包含这个字符串的数组
var arr = new Array(5,"abc",20)    //传递多个元素时，表示创建了包含这些个元素的数组，有多少元素，长度就为多少

    （2）.使用数组字面量：

var arr = []    //创建一个空数组
var arr = [,,,,,]    //只传递逗号时，表示数组的长度，传递几个逗号，长度为几
var arr = ["abc",2,"123"]    //创建一个包含这些元素的数组

2.数组的一些属性和方法：

    （1） length：表示数组中元素的数量

var arr = [1,"456","abc"]
console,log(arr.length)      //输出3（元素的数量）

    （2） prototype：向数组添加属性或方法，添加之后，所有创建出来的数组对象都会有此属性或方法（prototype是个全局属性，不仅可以向数组（数组本身就是对象）添加属性或方法，可以向任何对象添加），示例：

//将创建的数组的值都转换为大写字母
Array.prototype.Cap = function(){
    for(var i = 0;i < this.length;i ++){
        this[i] = this[i].toUpperCase();
    }
}
//创建一个数组，调用Cap()方法
var arr = ["ssdj","df","dsf","s"];
arr.Cap();
//在控制台查看结果
console.log(arr)    //输出["SSDJ", "DF", "DSF", "S"]

    （3） push()：向数组的末尾添加一个或多个元素，并返回新的长度

var arr = [1,"2","abc"]；
arr.push("456");
console.log(arr)    //输出[1,"2","abc","456"]

    （4） unshift()：向数组的开头添加一个或多个元素，并返回新的长度

var arr = [1,"2","abc"]；
arr.unshift("你好");
console.log(arr)    //输出["你好",1,"2","abc"]

    （5） pop()：删除数组的最后一个元素

var arr = [1,"2","abc"]；
arr.pop();
console.log(arr)    //输出[1,"2"]

    （6） shift()：删除数组的第一个元素

var arr = [1,"2","abc"]；
arr.shift();
console.log(arr)    //输出["2","abc"]
//当数组为空的时候，则返回undefined

    （7） *join()：把数组的所有元素组成一个字符串，包括数组中的逗号，而join()中传递的参数，就相当于将数组中的逗号换成那个参数

var arr = ["a","b",2,"f"];
console.log(arr.join())    //输出字符串"a,b,2,f"
//当传递参数时
console.log(arr.join("-"))    //输出"a-b-2-f"

             使用join()实现字符串的重复：

function fun(str,n){
    return new Array(n + 1).join(str);
}
console.log(fun("你好",3))    //输出"你好你好你好"
//这里的n就相当于数组中的逗号，new Array(4)就等同于[,,,]

    （8） *sort()：对数组的元素进行从小到大排序，但是sort()都会将数组中元素转换成字符串再进行比较，包括数值，所以就会出现以下情况：

var arr = [12,5,43,252,3];
arr.sort();
console.log(arr)     //输出[12, 252, 3, 43, 5]

            解决以上出现的情况，可以创建一个比较函数，然后用sort()调用那个函数

//比较函数可传递两个参数，如果num1位于num2之前，返回一个负数；相等则返回0；num1位于num2之后，返回一个正数
function fun(num1,num2){
    if(num1 < num2){
       return -1;
    }else if(num1 > num2){
       return 1;
    }else{
       return 0;
    }
}
var arr = [12,5,43,252,3];
console.log(arr.sort(fun))    //输出[3, 5, 12, 43, 252]   
//如果需要进行降序，只需交换一下return的值即可

    （9） reverse()：反转数组中元素的顺序

var arr = ["a","b",2,"f"]
arr.reverse();
console.log(arr)    //输出["f", 2, "b", "a"]

    （10） concat()：创建一个原数组的副本，并可以添加参数，参数会添加到副本的末尾，且原数组不会有任何改变

var arr = ["a","b",2,"f"]
var arrCopy = arr.concat()
console.log(arrCopy)   //输出["a","b",2,"f"]，相当于复制了原数组
var arrCopy1 = arr.concat("你好","haha")
console.log(arrCopy1)   //输出["a","b",2,"f","你好","haha"]
console,log(arr)      //输出原数组，没有发生改变

    （11） *slice()：截取，创建一个原数组的副本，可添加参数，参数需为数字，数字表示下标，表示从一个数字的下标开始到另一个数字的下标结束（注：不包括结束的下标）

var arr = ["a","b",2,"f","ha"]
        //  0   1  2  3    4
//传递一个参数1,表示从1开始截取（包括1）
var arrCopy = arr.slice(1)
console.log(arrCopy)     //输出["b", 2, "f","ha"]
//传递两个参数,表示从1开始截取到4结束（包括1，但不包括4）
var arrCopy1 = arr.slice(1,4)
console.log(arrCopy1)    //输出["b", 2, "f"]
//当传递的参数为负数时，将负数加上数组的长度length的值来替换该位置的数
var arrCopy2 = arr.slice(1,-1)
console.log(arrCopy2)    //输出["b", 2, "f"]
//该数组length值为5，-1+5=4，所以依然是从1开始截取到4结束(不包括4)

    （12） *splice()：这是个很重要的数组方法，可以向数组中添加，替换或删除元素

        删除：可以删除任意数量的元素，指定 2 个参数：（指定的位置，要删除的元素的个数），如果没有第二个参数时，则指定位置后所有元素都会被删除

var arr = [1,3,5,7,9,11];
var arrCopy = arr.splice(1,2) ;
//从1位置开始删除2个元素
console.log(arr)    //输出[1, 7, 9, 11]

        插入：可以向指定位置插入任意数量的元素，指定 3 个参数：（指定的位置，要删除的元素的个数，要添加的元素）

var arr = [1,3,5,7,9,11];
var arrCopy = arr.splice(1,2,4,"6") ;
//从1位置开始删除2个元素，添加4和"6"
console.log(arr)    //输出[1, 4, "6", 7, 9, 11]

    （13） indexOf() 和 lastIndexOf()：

        indexOf：从数组的首字符开始查找数组中元素所在的位置，指定 2 个参数：（要查找的元素，从什么位置开始查找（可选））

var arr1 = [1,3,5,11,7,9,11];
console.log(arr1.indexOf(11))      //输出位置3
console.log(arr1.indexOf(11,4))    //输出位置6，是从第4位置开始检索查找

        lastIndexOf：从数组的末尾字符开始查找数组中元素所在的位置，指定的参数同indexOf一样：（要查找的元素，从什么位置开始查找（可选））

var arr1 = [1,3,5,11,7,9,11];
console.log(arr1.lastIndexOf(11))      //输出位置6

    （14） map()：通过指定函数处理数组的每个元素，最后以数组的形式返回出来

//求下列数组中元素的平方
var arr = [1,2,3,4,5]
var arr2 = arr.map(function(num){
     return num*num;
});
console.log(arr2)   //输出[1, 4, 9, 16, 25]

    （15） every()：判断数组中每个元素都是否满足给定的条件，且只有所有元素都满足条件时，才会返回true

var arr = [1,2,3,4,5];
var arr3 = arr.every(function(x){
     return x < 8;
})
console.log(arr3)     //输出true
//当有任意一个元素不满足条件时，返回false

    （16） filter()：“过滤”功能，通过指定函数处理数组的每个元素，最后返回满足过滤条件的数组

//查找下列数组中大于15的元素
var arr = [11,22,13,24,15];
var arr4 = arr.filter(function(x){
     return x > 15;
})
console.log(arr4)      //输出[22, 24]

3.类数组（伪数组）：

    定义：类数组本质是一个对象，但是可以利用对象和数据的特性，模拟成数组，且必须要含有length属性，示例：

var obj = {
    0 : "a",
    1 : "b",
    2 : 8,
    3 : "c",
    length : 4,
    push : Array.prototype.push,   //这个类数组就有了push这个方法
}        
obj.push("d")       //在数组的末尾添加一个"d"    
console.log(obj.length)    //此时输出的length为5,表示添加成功

    类数组转换为数组，以上面代码为例：

var obj1 = Array.prototype.slice.call(obj)
console.log(obj1)    //输出数组["a", "b", 8, "c"]

    *下面是一道关于类数组的面试题：

var obj = {
     "2" : "a",    
     "3" : "b",     
     "length" : 2,
     "push" : Array.prototype.push
}
obj.push("c");
obj.push("d");
// 问最后这个console.log(obj)输出的是什么？
// 解答：
// "2" : "a",  -->    等同于 "0" : "a"
// "3" : "b"   -->    等同于 "1" : "b"
// push("c")   -->    等同于 "2" : "c"
// push("d")   -->    等同于 "3" : "d"
// 所以最后添加上去的"c"和"d"会将之前的"a"和"b"的值覆盖，length的值为4