1 创建数组
字面量语法(数组直接量)或构造函数
需要注意的是数组直接量的语法允许有可选的结尾的逗号,所以[,,]
只有两个元素而非三个
2 数组元素的读和写
需要注意的是如果是负数或非负来索引数组,数组将转换为字符串,字符串作为属性名来用。
var arr = [];
arr[-12] = 10;
console.log(arr[-12]); //此时这是一个属性
数组也是对象,所以也可以定义getter和setter方法
var arr = [];
Object.defineProperties(arr, {
name: {
value: "Oliver",
writable: true
},
getName: {
set: function(value) {
this.name = value;
},
get: function() {
return this.name;
}
}
})
arr.getName = "Oli"; //写入数据
console.log(arr.getName); //读取数据
3 稀疏数组
定义稀疏数组:
var arr0 = [,,,]; // 稀疏
var arr1 = [1,,2,]; // 稀疏
var arr2 = new Array(3); // 稀疏
var arr3 = new Array(); arr3.length = 3; // 稀疏
var arr4 = [1,2,3]; delete arr4[0]; // 稀疏
// 以下都是非稀疏
var arr5 = [undefined, undefined, undefined];
var arr6 = new Array(3); arr6[0] = undefined; arr6[1] = undefined; arr6[2] = undefined;
需要注意的是当在数组直击量中省略值时不回创建稀疏数组。省略的元素在数组中是存在的,值是undefined,可以用in操作符检测
判断是否是稀疏数组:
index in array
forEach
4 数组长度
length属性
另外可以用Object.defineProperty()让数组的length属性变为只读:
var arr = [,,,];
Object.defineProperty(arr, "length", {
writable: false
})
arr.length = 10; //严格模式下报错
也可以用preventExtensible、seal、freeze来设置权限;
var arr = [,,,];
Object.preventExtensions(arr);
console.log(arr.length); //3
arr.push("hello"); //严格模式下报错
5 数组元素的添加和删除
pop方法
push方法
shift方法
unshift方法
splice方法
delete方法
需要注意的是delete操作不会影响数组的长度
var arr = [1,2,3,4];
delete arr[2];
console.log(arr.toString()); //1,2,,4 变成了稀疏数组
6 数组遍历
使用for循环是遍历数组元素最常见的方法:
// let o = {
// name: "Oliver",
// age: 18
// };
let o = ["Oliver", 18];
var keys = Object.keys(o); //属性名数组
var values = [];
for (var i = 0; i < keys.length; i++) {
var key = keys[i];
values[i] = o[key];
};
console.log(keys.toString()); //属性名
console.log(values.toString()); //值
或for-in循环:
for (let key in arr) {
console.log(arr[key]);
}
// for (let key in arr) {
// if (!arr[key]) {
// continue;
// }
// console.log(arr[key]);
// }
for-in循环会枚举到继承的属性,需要过滤:
for (let key in arr) {
if (!arr.hasOwnProperty(key)) {
continue;
}
console.log(arr[key]);
}
最好不要用forin循环,遍历可能是升序也可能不是。
ES5中规定了新的方法forEach():
let arr = ["Oliver",,null,,,,undefined, 18];
arr.forEach( function(element, index) {
console.log(element);
console.log(index);
});
//Oliver
//0
//null
//2
//undefined
//6
//18
//7
7 多维数组
所谓的多维数组在JS中就是数组的数组;
8 ES3数组方法
8.1 join()和字符串方法split()
let arr = ["Oliver",,null,,,,undefined, 18];
console.log(arr.length); //8
var result = arr.join(" ");
console.log(result); //Oliver 18
console.log(result.split(" ").length); //8
console.log(result.split(" ").toString()); //Oliver,,,,,,,18
8.2 reverse()
8.3 sort()以及比较函数的参数
let arr = [213, 23, 2123, 1, 4, "Oliver", "Alice", "ali", "oli"];
console.log(arr.sort().toString()); //1,2123,213,23,4
console.log(arr.sort(compare).toString()); //1,2123,213,23,4,ali,Alice,oli,Oliver
function compare(a, b) {
var a = a.toString().toLowerCase();
var b = b.toString().toLowerCase();
if (a > b) { //从小到大
return 1;
} else if (a = b) {
return 0;
} else {
return -1;
}
}
8.4 返回新数组 concat() 接收可选的多个参数 不改变原来的数组
8.5 返回子数组 slice() 接收可选的一个或两个参数 不改变原来的数组
8.6 插入和删除数组 splice() 接收可选的一个起始位置、删除的个数以及任意的要插入的元素
let arr = [213, 23,1,3,4,43];
var a = arr.splice(1,0,"hello");
console.log(arr.toString()); //213,hello,23,1,3,4,43
console.log(a.toString()); //空 没有元素被删除
8.7push()和pop(),unshift()和shift()
8.8 toString()和toLocaleString()
9 ES5数组方法
9.1 forEach()
接收一个函数,该函数可以有三个参数:
数组元素
元素的索引
数组本身
语法:
array.forEach( function(element, index, array) {
// statements
});
let arr = [1,2,3,4,5];
arr.forEach( function(element, index, array) {
switch (arr[index]) {
case 1:
array[index] = element + "st";
break;
case 2:
array[index] = element + "nd";
break;
case 3:
array[index] = element + "rd";
break;
default:
array[index] = element + "th";
break;
}
});
console.log(arr.toString()); //1st,2nd,3rd,4th,5th
9.2 map()
该方法将调用的数组的每个元素传递给指定的函数,并返回一个数组,包含该函数的返回值,也就是说,传递给map方法的函数必须有返回值。map方法返回的是新的数组
语法:
var newArray = array.map(function (item) {
// body...
})
let arr = [1,2,3,4,5];
let newArray = arr.map(function (item) {
var index = arr.indexOf(item);
if (arr[index + 1]) {
return item + arr[index + 1]
}
});
console.log(newArray.join(";"));
9.3 filter()
该方法接收的函数是用来逻辑判定的,如果为真,则将该子集的成员添加到一个作为返回值中的数组中;
语法:
var newArray = array.filter(function (x) {
// body...
});
var arr = [1, 2, 3, 4, 5, 6];
var smaller = arr.filter(function(x) {
if (x < 4) return true;
});
console.log(smaller.toString()); //1,2,3
var doubles = arr.filter(function(a, b) {
if ((a + b) === 5) {
return true
}
});
console.log(doubles.toString()); //3
filter方法会跳过稀疏数组中缺少的元素,返回的数组是稠密的,可以用来压缩稀疏数组
var arr = [1, , undefined, , null, 6];
var anotherA = arr.filter(function(item) {
return true;
});
console.log(anotherA.toString()); //1,,,6
也可以压缩空缺并删除undefined和null元素
var arr = [1, , undefined, , null, 6];
var anotherA = arr.filter(function(item) {
return item !== undefined && item !== null;
});
console.log(anotherA.toString()); //1,6
9.4 every()和some()
every方法,当且仅当数组中的成员在判定函数中都返回true,才返回true;
some方法,至少有一个数组中的成员在判定函数中返回true,就返回true;
9.5 reduce()和reduceRight()
reduce方法
将数组进行组合,生成单个值,第二个参数为初始值(如果没有指定初始值,那么使用数组的第一个元素作为其初始值)
语法:
var result = array.reduce(function(previous, current, index, array) {
//body...
}, initialValue);
var arr = [1,2,3,4,5,6];
var result = arr.reduce(function (x,y) {
return x + y;
}, 0);
console.log(result); //21
实际运用(多维数组的扁平化):
var matrix = [
[1, 2],
[3, 4],
[5, 6, 7],
[8, 9, 10, 11]
];
var result = matrix.reduce(function(previous, current, index, array) {
return previous.concat(current);
});
console.log(result.toString()); //1,2,3,4,5,6,7,8,9,10,11
reduceRight方法(从右到左的顺序)
var matrix = [
[1, 2],
[3, 4],
[5, 6, 7],
[8, 9, 10, 11]
];
var result = matrix.reduceRight(function(previous, current, index, array) {
return previous.concat(current);
});
console.log(result.toString()); //8,9,10,11,5,6,7,3,4,1,2
9.6 indexOf()和lastIndexOf()
10 数组类型
检测是否数组:
Array.isArray()
Object.prototype.toString.call()
console.log(Array.isArray([])); //True
console.log(Object.prototype.toString.call([]).slice(8, -1)); //Array
11 类数组对象
创建类数组对象
//新建空的Object,a
let a = {};
//向a添加属性
var i = 0;
while (i < 10) {
a[i] = i;
i++
}
//添加length属性
a.length = i;
//完成
//当做数组遍历它
for (var i = 0; i < a.length; i++) {
console.log(a[i]);
};
//输出0-9
12 作为数组的字符串
字符串可以当做数组,使用方括号语法访问数据;但是字符串是不可变值,类似Array.prototype.push()等方法不可用。