0、数组的方法大合集
含义
方法
返回值
改变原数组
删除
pop()
删除项
yes
删除
shift()
删除项
yes
截取
slice()
删除项
no
删除
splice()
新数组
yes
删除
length
/
yes
添加
push()
length
yes
添加
unshift()
length
yes
添加
concat()
新数组
no
添加
splice()
删除项
yes
添加
[...array,...array1]
新数组
no
添加
Array.prototype.push.apply(arr1,arr2)
length
yes
改
splice()
新数组
yes
排序
sort()
新数组
yes
反向
reverse()
新数组
yes
递归
reduce()
计算的值
no
递归
reduceRight()
计算的值
no
查位置
indexof()
位置
no
反向查位置
lastIndexOf()
位置
no
找到第一个符合的成员
find()
成员
no
找到第一个符合的位置
findIndex()
位置
no
包含值否
includes()
boolean
no
计算
map()
计算后
no
过滤
filter()
满足条件的
no
判断都
every()
boolean
no
判断有
some()
boolean
no
遍历
forEach()
return的值
no
string->arry
split()
array
no
arry->string
join()
string
no
arry->string
toString()
string
no
arry->string
toLocalString()
string
no
obj-->arry
for ..in 循环赋值法
/
/
obj-->arry
Array.from()
新数组
/
number-->arry
Array.of()
新数组
/
填充/替换
fill(值,start,end)
新数组
yes
键值对
entries()
键值对
no
建值
keys()
建值
no
建名
values()
建名
no
指定位置的成员复制到其他位置
copyWithin(target,start,end)
新数组
yes
一、对数组的增 删 改 查:
数组的增加
array.push() 向数组末尾添加元素,返回的是添加后新数组的长度,原有数组改变
array.unshift() 向数组开头添加元素,返回的是添加后新数组的长度,原有数组改变
array.splice(n,m,x) 从索引n开始删除m个元素,然后插入元素x,把删除的内容当做新数组返回,原有数组改变。作添加使用,将m设置为0 即可。
array.concat(),拼接数组。返回拼接之后的数组,原数组不改变。
[...arr1, ...arr2, ...arr3] 解构数组,数组与数组的合并,返回合并的数组,原数组不改变。
Array.prototype.push.apply(arr1,arr2);----将arr2追加到arr1中,返回数组的长度,改变原数组。
数组的删除
array.pop() 删除数组的最后一项,返回的是删除的那一项,原有数组改变
array.shift() 删除数组的的第一项,返回的是删除的那一项,原有数组改变
splice(n,m,x) 从索引n开始删除m个元素,然后插入元素x,把删除的内容当做新数组返回,原有数组改变。作删除使用,x不传入数据既可。
slice(n,m) 从索引n开始删除m个元素,返回删除项,原数组不变
length 减小数组的长度,实际是从数组尾部删除元素,改变原数组。
改
其实只有一种 splice(),但delete方法,我个人感觉算修改不属于删除,详情请见实例
查
indeOf()
lastIndexOf()
find()
findIndex()
includes()
[1, 4, -5, 10].find((n) => n < 0) // -5
[1, 4, -5, 10].findIndex((n) => n < 0) // 2
[1, 2, 3].includes(2) // true
二、数组深浅拷贝
对象和数组的拷贝有两种
浅拷贝即 拷贝了指针指向,当一个对象的值改变会影响另一个对象的值。
深拷贝, 拷贝的是真正的值。2者相互独立,互不干扰。
浅拷贝的方法4种方法
slice() concat() 赋值法 遍历
注:concat 和 slice 对一维数组 能算是深拷贝;2维的 是浅拷贝
var a= [1,2,3,4]
b= a.concat();
c=a.concat();
b[0] = 5;
c[0] = 6;
a // [1,2,3,4]
b // [5,2,3,4]
c // [6,2,3,4]
var aa= [[1,1],[2,2],3,4]
bb= aa.concat();
cc=aa.concat();
bb[1][0] = 5;
cc[0] = 6;
aa // [[1,1],[5,2],3,4]
b // [[1,1],[5,2],3,4]
c // [6,[5,2],3,4]
var shallowCopy = function(obj) {
// 只拷贝对象
if (typeof obj !== 'object') return;
// 根据obj的类型判断是新建一个数组还是对象
var newObj = obj instanceof Array ? [] : {};
// 遍历obj,并且判断是obj的属性才拷贝
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
newObj[key] = obj[key];
}
}
return newObj;
}
深拷贝的方法5种方法:
一维数组和对象的concat slice法 JSON.parse(JSON.stringify(arr)) 和遍历法 解构赋值法
示例:(前3种毕竟简单,这里也不表述)
解构赋值法:const a1 = [1, 2]; const a2 = [...a1];或者const [...a2] = a1;
var deepCopy = function(obj) {
if (typeof obj !== 'object') return;
var newObj = obj instanceof Array ? [] : {};
for (var key in obj) {
if (obj.hasOwnProperty(key)) {
newObj[key] = typeof obj[key] === 'object' ? deepCopy(obj[key]) : obj[key];
}
}
return newObj;
}
三、数组与字符串 对象的转换
3.1字符串转数组
**es5 split(',');
es6 扩展运算符**
let hh = 'fh,fed,fd';
hh.split(','); // [fh,fed,fd]
[...'hello']
// [ "h", "e", "l", "l", "o" ]
3.2数组转字符串
2.1 toString();
2.2 toLocaleString();
2.3 join(',')
2.4 遍历,然后拼接法
![这里写图片描述](https://img-blog.csdn.net/20180201154816999?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQva2F0YXJhMTEwOQ==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast)
3.3 类似数组对象转数组
es5 Array.prototype.slice.call(obj) / [].slice.call(obj)
es6 Array.from(obj)
一组值转为数组
es6 Array.of(2,3,4); // [2,3,4]
四、数组去重
[...new Set(arr1)]
五、 数组的5个迭代方法----在数组的每一项上运行函数
filter();---返回true项的数组
map();-----返回运算后的组成的新数组
every();--每一项都是true,则返回true
forEach();-----无返回值
some();----有一项返回true,则返回true
六、并归方法
reduce();
Array的reduce()把一个函数作用在这个Array的[x1, x2, x3...]上,这个函数必须接收两个参数,reduce()把结果继续和序列的下一个元素做累积计算,
[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
var arr = [1, 3, 5, 7, 9];
arr.reduce(function (x, y) {
return x + y;
}); // 25
reduceRight();反向并归
七 判断数组
2-3种方法
`
var ss=[];
typeof ss; // object
ss instanceof Array; // true
Array.isArray(ss); // true;
`
八 将nodeList转换成数组
(2方法)
var elements = document.querySelectorAll("p"); // NodeList var arrayElements = [].slice.call(elements); // Now the NodeList is an array var arrayElements = Array.from(elements); // This is another way of converting
九 数组元素的洗牌
var list = [1,2,3];
list.sort(function() { return Math.random() - 0.5 })); // [2,1,3]
上述的是 投机取巧的方式
真正的数组乱序,请见
function shuffle(a) {
var length = a.length;
var shuffled = Array(length);
for (var index = 0, rand; index < length; index++) {
rand = ~~(Math.random() * (index + 1));
if (rand !== index)
shuffled[index] = shuffled[rand];
shuffled[rand] = a[index];
}
return shuffled;
}
function shuffle(a) {
var b = [];
while (a.length) {
var index = ~~(Math.random() * a.length);
b.push(a[index]);
a.splice(index, 1);
}
return b;
}
10.考题
1.
Array.isArray( Array.prototype )
// true ;because:Array.prototype is an Array
2.
var a = [0];
if ([0]) {
console.log(a == true);
} else {
console.log("wut");
}
// false ;
// because:[0] as a boolean is considered true. Alas, when using it in the comparisons it gets converted in a different way and all goes to hell.
3.
[]==[]
// false;because: == is the spawn of satan.
4.
var ary = Array(3);
ary[0]=2
ary.map(function(elem) { return '1'; });
// [1,empty*2]
5.
[1 < 2 < 3, 3 < 2 < 1]
// [true] // true <3 => 1<3 false < 1 => 0<1
6.
var a = [1, 2, 3],
b = [1, 2, 3],
c = [1, 2, 4]
a == b
a === b
a > c
a < c
// false false false true ;
// because:字面量相等的数组也不相等. 数组在比较大小的时候按照字典序比较