JavaScript 深入学习之Array

数组 是内存里一块连续的存储区域，可以通过指针（下标）查找该块区域内的所有元素。

JavaScript Array 对象是用于构造数组的全局对象; 它是高阶的、类似于列表的对象。

虽然 ECMAScript 数组与其他语言中的数组都是数据的有序列表，但与其他语言不同的是，ECMAScript 数组的每一项可以保存任何类型且不定长的数据。

数组的初始化方式：

// Array 构造函数
var colors = new Array(20); // 创建一个长度为20的数组，每个元素的默认值为undefined
var colors = new Array("red", "blue", "green"); // 长度为3的数组，元素分别为"red","blue","green"
// 当向构造函数里传入一个数字2时，意思为创建一个长度为2、初始值为undefined的数组，
// 如果是一个字符串"string"，意思是创建一个长度为1，第一个元素为"string"的数组


// 字面量
var colors = ["a", "b", "c"]; 
var nums = [1] // 创建一个长度为1的数组，且第一个元素为1
// 因为JavaScript的数组元素是动态可变的，所以当只定义长度时，数组元素的初始值为undefined,如果是Java

Array的方法：

Array.from(arrayLike, mapFn, thisArg)

方法从一个类似数组或可迭代对象中创建一个新的数组实例。

• arrayLike （想要转换成数组的伪数组对象或可迭代对象）
  
  • 维数组对象：dom中的类数组的节点集合
  • 可迭代对象：字符串、ES6新增的Map、Set、String，或者函数的内置属性argument
• mapFn (可选参数) 如果指定了该参数，新数组中的每个元素会执行该回调函数
  
  • mapFn方法参数和map()方法相同map(function(item, index, arr){})
• thisArg (可选参数) 可选参数，执行回调函数 mapFn 时 this 对象

<ul>
    <li>1li>
    <li>2li>
    <li>3li>
    <li>4li>
    <li>5li>
ul>

var Uli = document.querySelectorAll('li');
var aLi = Array.from(Uli)
console.log(aLi)
console.log(Array.isArray(Uli))
console.log(Array.isArray(aLi))

经过Array.from()方法后，dom的元素数组成了真正的数组对象。

---

Array.isArray(obj)

用于确定传递的值是否是一个 Array
- obj 需要检测的值
- 返回值为true或者false

---

Array.of(element0[, element1[, …[, elementN]]])

方法创建一个具有可变数量参数的新数组实例，传入的参数为需要添加进数组的元素。

• elementN 任意个参数，将按顺序成为返回数组中的元素。
• 新的 Array 实例。

console.log(Array.of(1))
console.log(Array.of(1, '1', {a: 1}))

与构造函数new Array() 不同的是，当传入一个数字时，
构造函数是创建当前数字长度的数组，初始值为undefined，
Array.of()把当前数字作为数组的第一个元素

---

concat(value1[, value2[, …[, valueN]]])

用于合并两个或多个数组。此方法不会更改现有数组，而是返回一个新数组。

• 参数的顺序依次是该参数的数组该参数的元素或者参数本身，例如：arr1.concat(‘ele1’, arr2)
• 该方法对参数内引用类型元素进行浅拷贝，对字符串、数字进行深拷贝

// 以下日志实在断点情况下打印出来的，如果没有断点，计算机运行速度太快看不出来
var arr1 = [1, 2, {index: 1,name: 'hello'}]
var arr2 = [1, 'nihao']
var newArr = arr1.concat(arr2)
console.log(newArr)
arr1[2].index = 2
arr1[0] = 11
console.log(newArr)

---

slice(beginIndex, endIndex)

方法返回一个从开始到结束（不包括结束）选择的数组的一部分浅拷贝到一个新数组对象，原数组不会被修改。

• beginIndex， 从该所引处开始提取数组元素，默认从0开始；如果该值为负数，则从数组倒数第一个（从-1开始）开始查找
• endIndex，在该处停止提取数组元素（不提取该下标元素）；如果该值为负数，则到数组倒数第n个数停止提取；如果不填，或者大于数组长度-1，则提取全部。

// 日志截图是在断点情况下打印，非断点下没有影响
var arr1 = [1, 2, {index: 1,name: 'hello'}, 'string1']
var arr2 = arr1.slice(1, -1)
console.log(arr2)
arr1[2].name = 'world'
console.log(arr2)

---

splice(beginIndex, deleteCount, item1, item2, …)

通过删除现有元素和/或添加新元素来更改一个数组的内容，修改的是当前数组，返回值为被删除的数组。

• beginIndex
  
  • 开始删除的索引下标，默认从零开始；
  • 如果该值大于（数组长度-1），则从数组最后添加；
  • 如果该值为负值，表明从倒数第n个开始删除；
• deleteCount 要删除的元素个数
  
  • 如果该值被省略，则一直删除到数组尾；
  • 如果该值为0，则不删除
• items 需要添加的元素

var arr1 = [1, 2, {index: 1,name: 'hello'}, 'string1', 'world']
var arr2 = arr1.splice(1, 9, 'newitem1', 'newitem2')
console.log(arr1)
console.log(arr2)