1. Array.prototype.reduce();
数组 需要过滤一些数据之后 在进行格式化处理使用到filter和map 感觉要遍历两遍性能很低;
百度之后可以用reduce()方法实现: reduce可以只遍历一遍实现map和filter的组合
this.containers = containers.reduce((preValue, item) => {
return item.TotalPositions === item.UsedPositions
? preValue
: preValue.push({
label: item.Name,
value: item,
}) && preValue;
}, []);
参数有两个 第一个回调函数四个参数
- Accumulator (acc) (累计器)
- Current Value (cur) (当前值)
- Current Index (idx) (当前索引)
- Source Array (src) (源数组)
第二个参数 是初始值 (不指定初始值时,acc为数组第一个元素,cur为数组第二个元素,idx为1)
除此之外mdn中还有其他场景的例子 Array.prototype.reduce() - JavaScript | MDN
计算每个元素出现次数
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice'];
var countedNames = names.reduce(function (allNames, name) {
if (name in allNames) {
allNames[name]++;
}
else {
allNames[name] = 1;
}
return allNames;
}, {});
// countedNames is:
// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
2.Array.prototype.splice(), Array.prototype.slice(), String.prototype.split()
splice()方法通过删除或替换现有元素或者原地添加新的元素来修改数组,并以数组形式返回被修改的内容。此方法会改变原数组。
array.splice(start[, deleteCount[, item1[, item2[, ...]]]])
start:指定修改的开始位置(从0计数)。如果超出了数组的长度,则从数组末尾开始添加内容;如果是负值,则表示从数组末位开始的第几位(从-1计数,这意味着-n是倒数第n个元素并且等价于array.length-n
);如果负数的绝对值大于数组的长度,则表示开始位置为第0位。
deleteCount:整数,表示要移除的数组元素的个数。如果 deleteCount
大于 start
之后的元素的总数,则从 start
后面的元素都将被删除(含第 start
位)。如果 deleteCount
被省略了,或者它的值大于等于array.length - start
(也就是说,如果它大于或者等于start
之后的所有元素的数量),那么start
之后数组的所有元素都会被删除。如果 deleteCount
是 0 或者负数,则不移除元素。这种情况下,至少应添加一个新元素。
const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
console.log(months);
// Array ["Jan", "Feb", "March", "April", "June"]
months.splice(4, 1, 'May');
console.log(months);
// Array ["Jan", "Feb", "March", "April", "May"]
months.splice(7, 1, 'w');
console.log(months);
// Array ["Jan", "Feb", "March", "April", "May", "w"]
months.splice(-9, 1, 'w');
console.log(months);
// Array ["w", "Feb", "March", "April", "May", "w"]
slice() 方法返回一个新的数组对象,这一对象是一个由 begin
和 end
决定的原数组的浅拷贝(包括 begin
,不包括end
)。原始数组不会被改变。
语法:arr.slice([begin[, end]])
begin 可选
提取起始处的索引(从 0
开始),从该索引开始提取原数组元素。如果该参数为负数,则表示从原数组中的倒数第几个元素开始提取,slice(-2)
表示提取原数组中的倒数第二个元素到最后一个元素(包含最后一个元素)。如果省略 begin
,则 slice
从索引 0
开始。如果 begin
超出原数组的索引范围,则会返回空数组。
end 可选
提取终止处的索引(从 0
开始),在该索引处结束提取原数组元素。slice
会提取原数组中索引从 begin
到 end
的所有元素(包含 begin
,但不包含 end
)。slice(1,4)
会提取原数组中从第二个元素开始一直到第四个元素的所有元素 (索引为 1, 2, 3的元素)。如果该参数为负数, 则它表示在原数组中的倒数第几个元素结束抽取。 slice(-2,-1)
表示抽取了原数组中的倒数第二个元素到最后一个元素(不包含最后一个元素,也就是只有倒数第二个元素)。如果 end
被省略,则 slice
会一直提取到原数组末尾。如果 end
大于数组的长度,slice
也会一直提取到原数组末尾。
const animals = ['ant', 'bison', 'camel', 'duck', 'elephant'];
console.log(animals.slice(2));
// expected output: Array ["camel", "duck", "elephant"]
console.log(animals.slice(2, 4));
// expected output: Array ["camel", "duck"]
console.log(animals.slice(1, 5));
// expected output: Array ["bison", "camel", "duck", "elephant"]
console.log(animals.slice(-2));
// expected output: Array ["duck", "elephant"]
console.log(animals.slice(2, -1));
// expected output: Array ["camel", "duck"]
console.log(animals.slice());
// expected output: Array ["ant", "bison", "camel", "duck", "elephant"]
split()方法使用指定的分隔符字符串将一个StringString对象分割成子字符串数组,以一个指定的分割字串来决定每个拆分的位置。
用法:str.split([separator[, limit]])
参数:
separator
指定表示每个拆分应发生的点的字符串。separator
可以是一个字符串或正则表达式。 如果纯文本分隔符包含多个字符,则必须找到整个字符串来表示分割点。如果在str中省略或不出现分隔符,则返回的数组包含一个由整个字符串组成的元素。如果分隔符为空字符串,则将str原字符串中每个字符的数组形式返回。
limit
一个整数,限定返回的分割片段数量。当提供此参数时,split 方法会在指定分隔符的每次出现时分割该字符串,但在限制条目已放入数组时停止。如果在达到指定限制之前达到字符串的末尾,它可能仍然包含少于限制的条目。新数组中不返回剩下的文本。
警告:如果使用空字符串('')作为分隔符,则字符串不是在每个用户感知的字符(图形素集群)之间,也不是在每个Unicode字符(代码点)之间,而是在每个UTF-16代码单元之间。这会摧毁代理对。还请参见how do you get a string to a character array in javascript
const str = 'The quick brown fox jumps over the lazy dog.';
const words = str.split(' ');
console.log(words[3]);
// expected output: "fox"
const chars = str.split('');
console.log(chars[8]);
// expected output: "k"
const strCopy = str.split();
console.log(strCopy);
// expected output: Array ["The quick brown fox jumps over the lazy dog."]
3.WeakMap
与Map区别:
没有iterator不可遍历,无法获取到自己有什么值, key为弱引用,
弱引用:
const map = new Map();
const weakMap = new WeakMap();
let obj1 = {a:1};
let obj2 = {a:1};
map.set(obj1, 1);
// Map(1) {{…} => 1}
weakMap.set(obj2, 2);
// WeakMap {{…} => 2}
obj1 = null
// null
obj2 = null
// null
// obj1 与 obj2的外部引用消失 map仍保留obj1的值作为键 而weakMap则为空了
map
Map(1) {{…} => 1}[[Entries]]0: {Object => 1}size: 1[[Prototype]]: Map
weakMap
WeakMap {}[[Entries]]No properties[[Prototype]]: WeakMap