js — 数组Array

Posted 2020-11-13 一直努力的小羊

目录

• 1. isArray
• 2. 转换方法
• 3. 分割字符串 join
• 4. 栈方法
• 5. 队列方法
• 6. 重排序方法
• 7. 操作方法
• 8. 位置方法 — 索引
• 9. 迭代方法

数组 array

解释器 遇到var声明的变量，会把var声明的变量提升到全局作用域下

1. isArray

isArray() 判断当前数组是否为数组，返回值是true,则证明是数组

var arr = ['red','green','yellow'];
console.log(Array.isArray(arr));

2. 转换方法

调用数组的toString()方法会返回由数组中每个值的字符串形式拼接而成的一个以逗号分隔的字符串。

var num = 123;
var arr = ['red','green','yellow'];
console.log(arr.toString());//red,green,yellow
console.log(num.toString());
console.log(typeof num.toString());

3. 分割字符串 join

join()方法只接收一个参数。

var arr = ['red','green','yellow'];
console.log(arr.join('^'));

4. 栈方法

数组也可以像栈一样，既可以插入和删除项的数据结构。栈是一种LIFO(Last-In-First-Out,后进先出)的数据结构，也就是最新添加的那项元素最早被删除。而栈中项的插入（叫做推入）和移除(叫做弹出)，只发生在一个位置——栈的顶部。数组专门提供了 push() 和 pop() 方法，以便实现类似栈的行为。

1.push()方法

可以接收任意数量的参数，把它们逐个添加到数组末尾，并返回修改后数组的长度。

var arr = ['red','green','yellow'];
console.log(arr.push('purple')); //返回了数组的最新的长度
console.log(arr);

2.pop()方法

从数组末尾移除最后一项，减少数组的 length 值，然后返回移除的项。

var arr = ['red','green','yellow'];
console.log(arr.pop());//返回删除的内容
console.log(arr);

5. 队列方法

栈数据结构的访问规则是 LIFO(后进先出)，而队列数据结构的访问规则是 FIFO(First-In-First-Out， 先进先出)。队列在列表的末端添加项，从列表的前端移除项。

1.shift()方法

shift()方法 能够移除数组中的第一个项并返回该项，同时将数组长度减 1。

var arr = ['red','green','yellow'];
console.log(arr.shift());
console.log(arr);

2.unshift()方法

unshift()方法 能在数组前端添加任意个项并返回新数组的长度

var arr = ['red','green','yellow'];
//往数组的第一项上添加内容
console.log(arr.unshift('gray','black'));
console.log(arr);

6. 重排序方法

数组中已经存在两个可以直接用来重排序的方法：reverse() 和 sort()

1.reverse()方法

reverse翻转数组项的顺序

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

2.sort()方法

默认情况下，sort()方法按升序排列——即最小的值位于最前面，最大的值排在最后面。 为了实现排序，sort()方法会调用每个数组项的toString()转型方法，然后比较得到的字符串，以确定如何排序 。即使数组中的每一项都是数值，sort()方法比较的也是字符串。

var values = [0,1,5,10,15];varlus.sort();alert(values); //0,1,10,15,5

sort()方法可以接收一个比较函数作为参数，以便我们指定哪个值位于哪个值的前面。 以完成数组中数值的升序和降序功能

比较函数接收两个参数，如果第一个参数位于第二个参数之前则返回一个负数，如果两个参数相等则返回0，如果第一个参数位于第二个参数之后则返回正数。

function compare(v1,v2){
    if(v1 < v2){
        return 1;
    }else if (v1 > v2){
        return -1;
    }else{
        return 0;
    }
}
var values = [0, 1, 5, 10, 15];
values.sort(compare);
alert(values);    // 15,10,5,1,0

7. 操作方法

1.concat()方法 — 拼接

数组合并方法，一个数组调用concat()方法去合并另一个数组，返回一个新的数组。concat()接收的参数是可以是任意的。

• 参数为一个或多个数组，则该方法会将这些数组中每一项都添加到结果数组中。
• 参数不是数组，这些值就会被简单地添加到结果数组的末尾

var colors = ['red','blue','green'];
colors.concat('yello');//["red", "blue", "green", "yello"]
colors.concat({'name':'张三'});//["red", "blue", "green", {…}]
colors.concat({'name':'李四'},['black','brown']);// ["red", "blue", "green", {…}, "black", "brown"]

2.slice()方法 — 对数组进行分割

slice()方法，它能够基于当前数组中一个或多个项创建一个新数组。slice()方法可以接受一或两个参数，即要返回项的起始和结束位置。

• 一个参数的情况下，slice()方法会返回从该参数指定位置开始到当前数组默认的所有项
• 两个参数的情况下，该方法返回起始和结束位置之间的项——但不包括结束位置的项(顾头不顾尾)。

注意： slice()方法不会影响原始数组

var names = ['女神','wusir','太白'];
name.slice(1) // ['wusir','太白']

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

如果 slice() 方法的参数中有一个负数，则用数组长度加上该数来确定响应的位置。

var colors = ['red','blue','green','yellow','purple'];
colors.slice(-2,-1);//["yellow"] 
colors.slice(-1,-2);//[]

3.splice()方法 — 对数组进行添加，删除，替换操作

splice()方法这个恐怕要算是最强大的数组的方法了，它有很多种用法。

splice()的主要用途是向数组的中路插入项。使用这种方法的方式有3种：

• 1.删除：可以删除任意数量的项，只需指定2个参数：要删除的第一项的位置和要删除的个数。例如splice(0,2)会删除数组中的前两项
• 2.插入：可以向指定位置插入任意数量的项，只需提供3个参数：起始位置、0（要删除的个数）和要插入的项。如果要插入多个项，可以再传入第四、第五、以至任意多个项。例如，splice(2,0,‘red‘,‘green‘)会从当前数组的位置2开始插入字符串‘red‘和‘green‘。
• 3.替换：可以向指定位置插入任意数量的项，且同时删除任意数量的项，只需指定 3 个参数:起始位置、要删除的项数和要插入的任意数量的项。插入的项数不必与删除的项数相等。例如，splice (2,1,"red","green")会删除当前数组位置 2 的项，然后再从位置 2 开始插入字符串"red"和"green"。

splice()方法始终都会返回一个数组，该数组中包含从原始数组中删除的项(如果没有删除任何 项，则返回一个空数组)。

var colors = ["red", "green", "blue"];
var removed = colors.splice(0,1); 
alert(colors); // green,blue 
alert(removed); // red，返回的数组中只包含一项
removed = colors.splice(1, 0, "yellow", "orange"); 
alert(colors); // green,yellow,orange,blue alert(removed); // 返回的是一个空数组
removed = colors.splice(1, 1, "red", "purple"); 
alert(colors); // green,red,purple,orange,blue alert(removed); // yellow，返回的数组中只包含一项

8. 位置方法 — 索引

indexOf()方法 从数组的开头(位置 0)开始向后查找

lastIndexOf()方法 则从数组的末尾开始向前查找。

var numbers = [1,2,3,4,5,4,3,2,1];
alert(numbers.indexOf(4)); //3
alert(numbers.lastIndexOf(4));// 5
alert(numbers.indexOf(4,4));// 5
alert(numbers.lastIndexOf(4,4));//3

9. 迭代方法

1.filter() 函数，它利用指定的函数确定是否在返回的数组中包含某一项.

var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.filter(function(item, index, array){
    return (item > 2);
});
alert(filterResult); //[3,4,5,4,3]

2.map() 方法也返回一个数组，而这个数组的每一项都是在原始数组中的对应项上运行输入函数的结果。

var numbers = [1,2,3,4,5,4,3,2,1];
var filterResult = numbers.map(function(item, index, array){
    return item * 2;
});
alert(filterResult); //[2,4,6,8,10,8,6,4,2]

3.forEach() 方法

forEach() 方法 只是对数组中的每一项运行传入的函数（ 仅能在数组对象中使用）。这个方法没有返回值， 本质上与使用 for 循环迭代数组一样。

var names = ['女神','wusir','太白'];
names.forEach(function (index,item) {
    console.log(index);
    console.log(item);
});

函数 arguments（在函数中arguments 这个对象是伪数组）

function  fn(a,b) {
    //arguments.length 代指的实参的个数
    //arguments它不是一个数组，它被称为叫伪数组
    console.log(arguments);
    for(var i = 0; i < arguments.length; i++){
        console.log(arguments[i]);
    }
}
fn(2,3,4);
console.log(fn.length);//形参的个数