JavaScript基础-----数组(Array)

Posted hyi520

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了JavaScript基础-----数组(Array)相关的知识,希望对你有一定的参考价值。

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  

 

以上是关于JavaScript基础-----数组(Array)的主要内容,如果未能解决你的问题,请参考以下文章

javascript基础知识 数组

javaScript基础02

JavaScript基础过关第三天

javascript基础(Array)

JavaScript语法基础三(数组)

JavaScript基础18——js的Array对象