let numbers = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
const zero = 0;
const positiveNumbers = [1, 2, 3];
const negativeNumbers = [-3, -2, -1];
应用场景 | 方法 | 使用 | 备注 |
---|---|---|---|
末尾插入元素 | push | numbers.push(12, 13); | |
开头插入元素 | unshift | numbers.unshift(-4, -3); | |
末尾删除元素 | pop | numbers.pop(); | |
开头删除元素 | shift | numbers.shift(); | |
任意位置添加或删除元素 | splice | numbers.splice(5,3); | 从数组索引 5 开始的 3 个元素 |
numbers.splice(5, 0, 2, 3, 4); | 第一个参数,删除或插入的元素的索引值 第二个参数,删除 元素的个数 第三个参数往后,添加到数组里的值 |
||
连接 2 个或更多数组,并返回结果 | concat | negativeNumbers.concat(zero, positiveNumbers); | |
对数组中的每个元素运行给定函数,如果该函数对每个元素都返回 true ,则返回 true | every | const isEven = x => x % 2 === 0; numbers.every(isEven); |
直到返回 false |
对数组中的每个元素运行给定函数,返回该函数会返回 true 的元素组成的数组 | filter | numbers.filter(isEven); | 返回新数组,返回 true 的元素 |
循环整个数组,但不需要返回值 | forEach | numbers.forEach(x => console.log(x % 2 === 0)); | 迭代整个数组 |
将所有的数组元素连接成一个字符串 | join | ||
返回第一个与给定参数相等的数组元素的索引,没有找到则返回 -1 | indexOf | ||
返回在数组中搜索到的与给定参数相等的元素的索引里最大的值 | lastIndexOf | ||
对数组中的每个元素运行给定函数,返回每次函数调用的结果组成的数组 | map | numbers.map(isEven); | 返回新数组,isEven 函数的运行结果 |
颠倒数组中元素的顺序,原先第一个元素现在变成最后一个,同样原先的最后一个元素变成了现在 的第一个 |
reverse | numbers.reverse(); | |
传入索引值,将数组里对应索引范围内的元素作为新数组返回 | slice | ||
对数组中的每个元素运行给定函数,如果任一元素返回 true ,则返回 true | some | numbers.some(isEven); | 直到函 数返回 true |
按照字母顺序对数组排序,支持传入指定排序方法的函数作为参数 | sort | numbers.sort(); | |
将数组作为字符串返回 | toString | ||
和 toString 类似,将数组作为字符串返回 | valueOf | ||
累加器 | reduce | numbers.reduce((previous, current) => previous + current); | 四个参数的函数: previousValue 、 currentValue 、 index 和 array |
ES2015 和 ES2016 新增的数组方法
返回一个包含数组键值对的迭代器对象,可以通过同步调用得到数组元素的键值对 | @@iterator | let iterator = numbersSymbol.iterator; console.log(iterator.next().value); // 1 console.log(iterator.next().value); // 2 console.log(iterator.next().value); // 3 console.log(iterator.next().value); // 4 console.log(iterator.next().value); // 5 for (const n of iterator) { console.log(n); } |
|
---|---|---|---|
复制数组中一系列元素到同一数组指定的起始位置 | copyWithin | 用法有些复杂,具体来看 | |
返回包含数组所有键值对的 @@iterator 集合、字典、散列表等数据结构 |
entries | let aEntries = numbers.entries(); // 得到键值对的迭代器 console.log(aEntries.next().value); // [0, 1] - 位置 0 的值为 1 console.log(aEntries.next().value); // [1, 2] - 位置 1 的值为 2 console.log(aEntries.next().value); // [2, 3] - 位置 2 的值为 3 for (const n of aEntries) { console.log(n); } |
|
如果数组中存在某个元素则返回 true ,否则返回 false 。E2016 新增 | includes | ||
根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素 | find | ||
根据回调函数给定的条件从数组中查找元素,如果找到则返回该元素在数组中的索引 | findIndex | ||
用静态值填充数组 | fill | numbersCopy.fill(1, 3, 5); | 把 1 填充到数组索引 3 到 5 的位置(不包括 3 和 5),得到的数组为 [0, 2, 2, 1, 1, 2] 。 |
根据已有数组创建一个新数组 | from | let numbers2 = Array.from(numbers); let evens = Array.from(numbers, x => (x % 2 == 0)); |
|
返回包含数组所有索引的 @@iterator | keys | const aKeys = numbers.keys(); console.log(aKeys.next()); // console.log(aKeys.next()); // console.log(aKeys.next()); // // 得到数组索引的迭代器 {value: 0, done: false } {value: 1, done: false } {value: 2, done: false } |
|
根据传入的参数创建一个新数组 | of | let numbersCopy = Array.of(…numbers4); | 和 Array.from(numbers4) 的效果是一样的 |
返回包含数组中所有值的 @@iterator | values | const aValues = numbers.values(); console.log(aValues.next()); // {value: 1, done: false } console.log(aValues.next()); // {value: 2, done: false } console.log(aValues.next()); // {value: 3, done: false } |
当前的浏览器还没有完全支持 ES2015 的新功能 |
迭代数组 | for…of | for (const n of numbers) { console.log(n % 2 === 0 ? ‘even’ : ‘odd’); } |
栈 后进先出(LIFO)
应用场景
编程语言的编译器、内存中保存变量、方法调用、浏览器历史记录(浏览器的返回按钮)
回溯问题-存储访问过的任务或路径、撤销的操作
使用场景 | 方法 | 使用 | 备注 |
---|---|---|---|
添加一个(或几个)新元素到栈顶 | push(element(s)) | push(element) { this.items.push(element); } |
|
移除栈顶的元素,同时返回被移除的元素 | pop() | pop() { return this.items.pop(); } |
|
返回栈顶的元素,不对栈做任何修改 | peek() | peek() { return this.items[this.items.length - 1]; } |
|
如果栈里没有任何元素就返回 true ,否则返回 false | isEmpty() | isEmpty() { return this.items.length === 0; } |
|
移除栈里的所有元素 | clear() | clear() { this.items = []; } |
Stack 类
//第一种方式
class Stack {
constructor() {
this._count = 0; //记录栈的大小
this._items = {};
}
// 方法
push(element) {
this._items[this._count] = element;
this._count++;
}
size() {
return this._count;
}
isEmpty() {
return this._count === 0;
}
pop() {
if (this.isEmpty()) { // {1}
return undefined;
}
this._count--; // {2}
const result = this._items[this._count]; // {3}
delete this._items[this._count]; // {4}
return result; // {5}
}
peek() {
if (this.isEmpty()) {
return undefined;
}
return this._items[this.count - 1];
}
clear() {
this._items = {};
this._count = 0;
//第二种清空的方式
//while (!this.isEmpty()) {
// this.pop();
//}
}
toString() {
if (this.isEmpty()) {
return '';
}
let objString = `${this._items[0]}`; // {1}
for (let i = 1; i < this._count; i++) { // {2}
objString += `,${this._items[i]}`; // {3}
}
return objString;
}
}
//用下划线命名约定来标记一个属性为私有属性,依赖开发的常识
//第二种方式 Symbol可以用作对象的属性
const _items = Symbol('stackItems'); // {1}
class Stack {
constructor () {
this[_items] = []; // {2} 要访问_items,只需要把所有的this.items都换成
}
// 栈的方法
}
//假的私有属性,ES2015 新增的 Object.getOwnProperty-Symbols 方法能够取到类里面声明的所有 Symbols 属性
const stack = new Stack();
stack.push(5);
stack.push(8);
let objectSymbols = Object.getOwnPropertySymbols(stack);
console.log(objectSymbols.length); // 输出 1
console.log(objectSymbols); // [Symbol()]
console.log(objectSymbols[0]); // Symbol()
stack[objectSymbols[0]].push(1);
stack.print(); // 输出 5, 8, 1
//_items 属性是一个数组,可以进行任意的数组操作
//第三种方式 ES2015 的 WeakMap 实现类
const items = new WeakMap(); // {1}
class Stack {
constructor () {
items.set(this, []); // {2} 以this(Stack类自己的引用)为键,把代表栈的数组存入items
}
push(element){
const s = items.get(this); // {3} 以 this 为键(行 {2} 设置的)从 items 中取值
s.push(element);
}
pop(){
const s = items.get(this);
const r = s.pop();
return r;
}
// 其他方法
}
//代码的可读性不强,而且在扩展该类时无法继承私有属性
//TypeScript 提供了一个给类属性和方法使用的 private 修饰符,该修饰符只在编译时有用,在代码被转移完成后,属性同样是公开的。
//私有属性的提案
class Stack {
#count = 0;
#items = 0;
// 栈的方法
}
平衡圆括号 汉诺塔