24 JS基础之--数组API（引用类型Array）

最新推荐文章于 2022-12-06 19:01:53 发布

喝着绿茶的猫

最新推荐文章于 2022-12-06 19:01:53 发布

阅读量513

点赞数

分类专栏： JavaScript基础文章标签： javascript

本文链接：https://blog.csdn.net/luyu13141314/article/details/53471290

版权

JavaScript基础专栏收录该内容

11 篇文章 0 订阅

订阅专栏

A instanceof B:

判断A是否是B构造出来的对象。是的话返回true，否返回false

//小例子1（数组）
var arr = [1,2,3];
var str = "123";

console.log(arr instanceof Array);//true
console.log(str instanceof Array);//false

//小例子2（字符串）
var str1 = "123";
var str2 = new String("123");//基本包装类型String

console.log(str1 instanceof String);//false
console.log(str2 instanceof String);//true

//小例子3（对象）
function Stu(name,age){
    this.name = name;
    this.age = age;
    this.study = function () {
        console.log("hello world");
    }
}

var stu = new Stu("张三",18);

console.log(stu instanceof Stu);//true。判断自定义类型是否符合标准
console.log(stu instanceof Object);//true

判断变量是否是数组：

instanceof

Array.isArray(变量)；

var arr = [1,2,3];
console.log(arr instanceof Array);//true.第1种判断方法
console.log(Array.isArray(arr));//true.第2种判断方法

数组API-把数组变成字符串 join

Array.join( ) 将数组元素连接起来以构建一个字符串

var arr = ["关羽","张飞","刘备"];

//不写参数，默认用","链接
console.log(arr.join());

//有参数，用参数链接
console.log(arr.join("-"));
console.log(arr.join("|"));

//无缝链接：使用的是""；
console.log(arr.join(""));


//如果" ",中间有空格用空格链接。
console.log(arr.join(" "));

反之，字符串分割成数组，使用是split

1:2:3:4:5".split(":");  // 返回 ["1","2","3","4","5"]

"|a|b|c|".split("|");    // 返回 ["", "a", "b", "c", ""] 

"hello".split("");     // 返回 ["h","e","l","l","o"]

"hello".split("", 3);  // 返回 ["h","e","l"]

数组API-元素的添加和删除 push/unshift

push()/unshift()————在数组的最后面添加/最前面添加

参数：添加的元素

返回值：数组的长度

var arr=[1,2,3];
var length1 = arr.push("abc");
var length2 = arr.unshift("def");

console.log(length1);//4
console.log(length2);//5
console.log(arr);//["def", 1, 2, 3, "abc"]

pop()/shift()————删除数组的最后一个元素/删除数组的第一个元素

参数：无
返回值：被删除的元素本身

var arr=[1,2,3];
var ele1 = arr.pop();
var ele2 = arr.shift();

console.log(ele1);//3
console.log(ele2);//1
console.log(arr);//[2]

数组API-数组元素的反转和排序 reverse

反转数组方法：reverse();此方法原数组被修改

var arr = [1,2,3,4,5];
console.log(arr.reverse());//[5, 4, 3, 2, 1]
console.log(arr);//[5, 4, 3, 2, 1]

在不用reverse()方法的情况下，也有三种实现反转数组的方法：

 //1.正向遍历反向添加。
    function rev1(array){
        var newArr = [];
        for(var i=0;i<array.length;i++){
            newArr[newArr.length] = array[array.length-1-i];
        }
        return newArr;
    }


//2.反向遍历正向添加。
    function rev2(array){
        var newArr = [];
        for(var i=array.length-1;i>=0;i--){
            newArr[newArr.length] = array[i];
        }
        return newArr;
    }


//3.原数组对调。(reverse底层原理)
    function rev3(array){
        for(var i=0;i<array.length/2;i++){
            //前后交换
            var temp = array[i];
            array[i] = array[array.length-1-i];
            array[array.length-1-i] = temp;
        }
        return array;
    }

数组排序方法：sort();此方法原数组被修改

无参：默认排序的是第一个字符的Unicode编码。如果为数字排序，需要带参。

有参：回调函数

如果回调函数中，return值是前一个参数-后一个参数。即升序排序
如果回调函数中，return值是后一个参数-前一个参数。即降序排序

var arr1 = [11,12,8,9,10];
var arr2 = ["e","f","a","d","b","c"];

console.log(arr1.sort());//[10, 11, 12, 8, 9]
console.log(arr2.sort());//["a", "b", "c", "d", "e", "f"]


//如果为数字排序，需要带参:

 var result = arr1.sort(function(a,b){
    return a-b;
    });
 console.log(result);//[8, 9, 10, 11, 12]

数组API-数组元素的连接 concat

元素的连接:Array.concat(value,…)

var arr1 = [1,2,3];
var arr2 = ["a","b","c"];
var arr3 = arr1.concat(arr2);

console.log(arr1);
console.log(arr2);
console.log(arr3);//[1, 2, 3, "a", "b", "c"]
console.log(arr1.concat(5));//[1,2,3,5];

数组API-数组元素的截取 slice

数组元素的截取：array.slice(start, end);

该方法并不修改原数组。

如果想删除数组中的一段元素，应该使用方法Array.splice

var arr= [1, 2, 3, "a", "b", "c"];


//一个参数：从索引值项截取到最后(包括本身)
console.log(arr.slice(3));//["a", "b", "c"]；

//两个参数：从索引值项截取到指定项(包左不包右)
console.log(arr.slice(0,3));//[1,2,3]

//负值：从后面数几位。
console.log(arr.slice(0,4));//[3, "a", "b", "c"]

//两个参数：前大后小，返回空数组[]
console.log(arr.slice(3,0));//[]
console.log(arr.slice(-1,-3));//[]

console.log(arr);//不修改原数组！！
console.log(arr.slice(-3,-1));//["a", "b"]

//截取所有：（不写end位置的话默认截取到结尾）
console.log(arr.slice(0));
console.log(arr.slice( ));

数组API-数组元素的删除和替换 splice

splice:元素的删除和替换（删除：指定位置的元素）

返回值：被删除的元素
1个参数:从哪个位置开始删除，删除到最后
2个参数：从哪个位置开始删除，删除几个。（删除指定元素的话，第二个参数为1）
3个或3个以上参数：从哪个位置开始删除，删除几个。用第三个以后的参数替换掉。

// 1个参数：
var arr = [1,2,3,"a","b","c","c"];

console.log(arr.splice(4));//["b","c","c"]
console.log(arr);//[1,2,3,"a"]


// 2个参数：从哪个位置开始删除，删除几个。（删除指定元素的话，第二个参数为1）
var arr = [1,2,3,"a","b","c","c"];
console.log(arr.splice(4, 1));//["b"],返回被删除的元素
console.log(arr);//[1,2,3,"a","c","c"]


// 3个参数：
var arr = [1,2,3,"a","b","c","c"];
console.log(arr.splice(3,3,"aaa","bbb"));["a", "b", "c"]
console.log(arr);//[1, 2, 3, "aaa", "bbb", "c"]

数组API-给数组元素查索引 indexOf

给元素查索引：

indexOf()/lastIndexOf() 从前往后差索引/从后往前差索引

var arr = ["a","b","c","c"];
console.log(arr.indexOf("c"));//2
console.log(arr.lastIndexOf("c"));//3

数组API-清空数组

方法1：arr = [];//推荐用法
方法2：arr.splice(0,arr.length);//不推荐
方法3：arr.length = 0;//不研究

方法一：
arr = [];
console.log(arr);

方法二:
console.log(arr.splice(0,arr.length));//[1, 2, 3, “a”, “b”, “c”, “c”]返回被删除的元素
console.log(arr);//[]

方法三:伪数组

var aArr = document.getElementsByTagName(“a”);
console.log(aArr);//[a]
aArr.length = 0;
console.log(aArr);//[a]

//伪数组的length属性有可以能发生改变但值不变
fn(1,2,3,4,5);
function fn(a,b){
console.log(arguments.length);//5
arguments.length = 0;
console.log(arguments.length);//0
}