数组的基本概念
数组是数据的有序列表,数组的每一项可以保存任何类型的数据。
创建数组的基本方式
调用Array构造函数
例子:
var arr = new Array("A", "B", "C");
console.log(arr[0]);
//输出:A
如果只给 Array 构造函数传递一个值创建数组需要特别注意:如果传递的是数值,则会按照该数值创建包含给定项数的数组;而如果传递的是其他类型的参数,则会创建包含那个值的只有一项的数组。
例子:
var arr1 = new Array(2);
console.log(arr1.length); //输出:2
console.log(arr1[0]); //输出:undefined
console.log(arr1[1]); //输出:undefined
var arr2 = new Array("2");
console.log(arr2.length); //输出:1
console.log(arr2[0]); //输出:2
使用Array构造函数时也可以省略new操作符。
例子:
var arr = Array(1, 2);
console.log(arr[0]);
//输出:1
数组字面量
例子:
var arr = ["A", "B", "C"];
console.log(arr[0]);
//输出:A
数组也是对象
数组是也是对象,我们可以给数组直接添加属性:
例子:
var arr = ["A", "B", "C"];
arr.name = "zimu";
console.log(arr.length); //输出:3
console.log(arr.name); //输出:zimu
*可以看到,虽然数组添加了属性,但数组的 length 值并未发生变化。
ES6新增的创建数组的方法
Array.of()
Array.of() 方法的主要目的是弥补 Array 构造函数的怪异行为。Array.of()
方法不存在单一数值型参数值的特例,无论有多少参数,无论参数是什么类型,Array.of() 方法总会创建一个包含所有参数的数组。
例子:
let arr1 = Array.of();
console.log(arr1.length); //输出:0
let arr2 = Array.of(1);
console.log(arr2.length); //输出:1
console.log(arr2[0]); //输出:1
let arr3 = Array.of("1");
console.log(arr3.length); //输出:1
console.log(arr3[0]); //输出:1
Array.from()
Array.from() 方法用于将可枚举的对象或类数组对象转换为真正的数组。
所谓类似数组的对象,本质特征只有一点,即必须有length属性。
例子:
ES5:类数组转为数组
let fn = (function() {
console.log({}.toString.call(arguments));
//输出:[object Arguments]
console.log({}.toString.call([].slice.call(arguments)));
//输出:[object Array]
})();
ES6:类数组转为数组
let fn = (function() {
console.log({}.toString.call(arguments));
//输出:[object Arguments]
console.log({}.toString.call(Array.from(arguments)));
//输出:[object Array]
})();
常见的类数组除了函数内部的arguments对象,还有 DOM 操作返回的节点集合和字符串。
例子:
节点集合转为数组
<button>1</button>
<button>2</button>
<button>3</button>
let nodeList = document.querySelectorAll("button");
console.log({}.toString.call(nodeList));
//输出:[object NodeList]
console.log({}.toString.call(Array.from(nodeList)));
//输出:[object Array]
字符串转为数组
console.log({}.toString.call(str));
//输出:[object String]
console.log({}.toString.call(Array.from(str)));
//输出:[object Array]
console.log(Array.from(str));
//输出:["l", "o", "v", "e"]
映射函数
Array.from() 方法提供了第二个参数,作用类似于数组的map方法,用来对每个元素进行处理,将处理后的值放入返回的数组。
例子:
let arr = Array.from([1, 2, 3], v => v + 1);
console.log(arr);
//输出:[2, 3, 4]
如有错误,欢迎指正,本人不胜感激。