js 数组详细操作方法及解析合集

前言

在开发中,数组的使用场景非常多,平日中也涉及到很多数组的api/相关操作,一直也没有对这块内容进行一块整理总结,很多时候就算用过几次这个api,在开发中也很容易忘记,还是要谷歌一下。所以就希望对这块内容有一个比较系统性的总结,在这背景下,就有了本篇文章,如果喜欢的话可以点波赞/关注,支持一下,希望大家看完本文可以有所收获。

创建一个数组:

// 字面量方式:
// 这个方法也是我们最常用的,在初始化数组的时候 相当方便
var a = [3, 11, 8]; // [3,11,8];
// 构造器:
// 实际上 new Array === Array,加不加new 一点影响都没有。
var a = Array(); // [] 
var a = Array(3); // [undefined,undefined,undefined]
var a = Array(3,11,8); // [ 3,11,8 ]

ES6 Array.of() 返回由所有参数值组成的数组

定义:返回由所有参数值组成的数组,如果没有参数,就返回一个空数组。

目的:Array.of() 出现的目的是为了解决上述构造器因参数个数不同,导致的行为有差异的问题。

let a = Array.of(3, 11, 8); // [3,11,8]
let a = Array.of(3); // [3]

ES6 Arrar.from() 将两类对象转为真正的数组

定义:用于将两类对象转为真正的数组(不改变原对象,返回新的数组)。

参数:

第一个参数(必需):要转化为真正数组的对象。

第二个参数(可选): 类似数组的map方法,对每个元素进行处理,将处理后的值放入返回的数组。

第三个参数(可选): 用来绑定this。

// 1. 对象拥有length属性
let obj = {0: 'a', 1: 'b', 2:'c', length: 3};
let arr = Array.from(obj); // ['a','b','c'];
// 2. 部署了 Iterator接口的数据结构 比如:字符串、Set、NodeList对象
let arr = Array.from('hello'); // ['h','e','l','l']
let arr = Array.from(new Set(['a','b'])); // ['a','b']

方法:

数组原型提供了非常多的方法,这里分为三类来讲,一类会改变原数组的值,一类是不会改变原数组,以及数组的遍历方法。

改变原数组的方法(9个):

let a = [1,2,3];
ES5:
a.pop()/ a.shift()/ a.push()/ a.unshift()/ a.reverse()/ a.splice()/ a.sort() 
ES6:
a.copyWithin() / a.fill

对于这些能够改变原数组的方法,要注意避免在循环遍历中改变原数组的选项,比如: 改变数组的长度,导致遍历的长度出现问题。

pop() 删除一个数组中的最后的一个元素

定义: pop() 方法删除一个数组中的最后的一个元素,并且返回这个元素。

参数: 无。

let a = [1,2,3];
let item = a.pop(); // 3
console.log(a); // [1,2]
      

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/490.html