Heim > Artikel > Web-Frontend > Klassische Techniken für JavaScript-Array-Operationen (organisiert und gemeinsam genutzt)
Dieser Artikel stellt Ihnen einige verwandte Vorgänge für Arrays in JavaScript vor, hauptsächlich einschließlich Array-Objekt-Prototypmethoden und allgemeine Vorgänge wie Deduplizierung, Reduzieren, Sortieren usw. Ich hoffe, er wird Ihnen hilfreich sein.
Javascript -Array -Operationen, die hauptsächlich Array -Objektprototypmethoden und gemeinsame Operationen wie Deduplizierung, Abflachung, Sortierung usw. enthalten. callback(( currentValue [, index [, array]])[, thisArg])
callback ist eine Funktion, die für jedes Element im Array ausgeführt wird. Diese Funktion empfängt einen bis drei Parameter
Der aktuelle Wert des Das aktuelle Element im Array wird verarbeitet. Index array optional [gibt das Array an, auf dem gearbeitet wird]
let arr = [1, 2, 3, 4, 5]; let obj = {a: 1}; arr.forEach(function(currentValue, index, array) { console.log("当前值:", currentValue);// 1 console.log("当前值索引:", index);// 0 console.log("当前处理数组:", array); // (5)[1, 2, 3, 4, 5] console.log("当前this指向:", this);// {a: 1} console.log("结束一次回调, 无需返回值"); console.log(""); }, obj); console.log(arr);// [1, 2, 3, 4, 5]不改变原数组
currentValue Das aktuelle Element, das im Array verarbeitet wird index optional [der Index des aktuelles Element, das im Array verarbeitet wird]
let arr = [1, 2, 3, 4, 5]; let obj = {a: 1}; let newArr = arr.map(function(currentValue, index, array) { console.log("当前值:", currentValue);// 1 console.log("当前值索引:", index);// 0 console.log("当前处理数组:", array); // (5)[1, 2, 3, 4, 5] console.log("当前this指向: ", this); // {a: 1} console.log(""); return crrentValue + 10; }, obj); console.log(newArr);// [11, 12, 13, 14, 15] console.log(arr);// [1, 2, 3, 4, 5]不改变原数组
elementN ist das Element, das am Ende des Arrays hinzugefügt wird.
let arr = ['a', 'b', 'c', 'd', 'e']; console.log(arr.push('f', 'g'));// 7 console.log(arr);// ["a", "b", "c", "d", "e", "f", "g"] 改变原数组shift shift( ) entfernt das erste Element aus dem Array und gibt den Wert des Elements zurück. Diese Methode ändert das ursprüngliche Array unshift() fügt ein oder mehrere Elemente am Anfang des Arrays hinzu und gibt die Länge des Arrays zurück. Diese Methode ändert das ursprüngliche Array [, item2[, ...]]]])start gibt die Änderung an. Die Startposition des Elements und entspricht array.length-1); Wenn der Absolutwert der negativen Zahl größer als die Länge des ist Array bedeutet, dass die Startposition Position 0 ist. deleteCount ist optional [Ganzzahl] und gibt die Anzahl der zu entfernenden Array-Elemente an. Wenn deleteCount größer als die Gesamtzahl der Elemente nach dem Start ist, werden alle Elemente nach statr gelöscht (einschließlich des Startbits). Wenn deleteCount weggelassen wird oder sein Wert größer oder gleich array.length-start ist (d. h. wenn er größer oder gleich der Anzahl aller Elemente nach start ist), dann alle Elemente des Arrays nach dem Start werden gelöscht
item1, item2, ...optional [Elemente, die dem Array hinzugefügt werden sollen, beginnend mit der Startposition. Wenn nicht angegeben, löscht splice() nur Array-Elemente]splice () ändert das Array, indem es vorhandene Elemente löscht oder ersetzt oder neue Elemente hinzufügt, und gibt den geänderten Inhalt in Form eines Arrays zurück. Diese Methode ändert das ursprüngliche Array ([begin[, end]])
begin optional [Index am Anfang der Extraktion] Beginnen Sie mit dem Extrahieren der ursprünglichen Array-Elemente aus diesem Index. Wenn dieser Parameter eine negative Zahl ist, bedeutet dies, dass mit dem Extrahieren ab den letzten paar Elementen begonnen wird ursprüngliches Array. Wenn begin weggelassen wird, beginnt das Slice bei Index 0; wenn begin größer als die Länge des ursprünglichen Arrays ist, wird ein leeres Array zurückgegeben. end ist optional [Index am Ende der Extraktion]. Durch Extrahieren der ursprünglichen Array-Elemente an diesem Index werden alle Elemente vom Anfang bis zum Ende des ursprünglichen Arrays extrahiert, einschließlich Anfang, aber nicht Ende. Wenn Ende weggelassen wird, extrahiert Slice bis zum Ende des Arrays Wenn end größer als die Länge des Arrays ist, wird auch Slice bis zum Ende des Arrays extrahiert. Dieses Objekt ist eine flache Kopie des ermittelten Originalarrays nach Anfang und Ende, einschließlich Anfang, ohne Ende und dem Original. Das Array wird nicht geändert. ]])valueN optional[], Array oder Wert in ein neues Array umwandeln. Wenn der Parameter valueN weggelassen wird, gibt concat eine flache Kopie des vorhandenen Arrays zurück, das aufgerufen wird concat()用于合并两个或多个数组, 此方法不会更改现有数组, 而是返回一个新数组 join arr.join([separator]) separator可选 指定一个字符串来分隔数组的每个元素 join()将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串. 如果数组只有一个项目, 那么将返回该项目而不使用分隔符 sort arr.sort([compareFunction]) compareFunction可选 用来指定按某种顺序进行排列的函数. 如果省略, 元素按照转换为第字符串的各个字符的Unicode进行排序 firstEl第一个用于比较的元素 secondEl第二个用于比较的元素 sort()用原地算法对数组的元素进行排序, 并返回数组. 默认排序顺序是在将元素转换为字符串, 然后比较它们的UTF-16代码单元值序列时构建的 reverse reverse()将数组中元素的位置颠倒, 并返回该数组, 该方法会改变原数组 every every()测试一个数组内的所有元素是否都能通过某个指定函数的测试, 返回一个布尔值 some some()测试数组中是不是至少有1个元素通过了提供的测试函数, 返回一个Boolean类型的值 filter filter()创建一个新数组, 其包含通过所提供的测试函数的所有元素 find find()返回数组中满足提供的测试函数的第一个元素的值, 否则返回undefined findIndex findIndex()返回数组中满足提供的测试函数的第一个元素的索引, 否则返回-1 includes includes()用来判断一个数组是否包含一个指定的值, 如果包含则返回true, 否则返回false indexOf indexof()返回指定元素在数组中的第一个索引, 否则返回-1 lastIndexOf lastIndexOf()返回指定元素在数组中的的最后一个索引, 如果不存在则返回-1 fill fill()用一个固定值填充一个数组从起始索引到终止索引到全部元素, 不包括终止索引 flat flat()会按照一个可指定的深度递归遍历数组, 并将所有元素与遍历到的子数组中的元素合并为一个新数组返回 keys keys()返回一个包含数组中每个索引键的Array Iterator对象 常用操作 数组去重 使用对象 使用Set 扁平化数组 使用flat 递归实现flat 统计一个字符串中出现最多的字符 使用数组将字符的ASCII码作为key制作桶 找出数组中的最大值 遍历数组 使用Math 使用reduce 拷贝数组 遍历数组使用push 使用concat 使用slice 随机打乱一个数组 随机交换N次 随机排序 【相关推荐:javascript学习教程】let arr1 = [1, 2, 3];
let arr2 = [4, 5, 6];
let arr3 = arr1.concat(arr2);
console.log(arr3);// [1, 2, 3, 4, 5, 6]
console.log(arr1);// [1, 2, 3] 不改变原数组
let arr = ['a', 'b', 'c'];
console.log(arr.join("&"));// a&b&c
console.log(arr);// ["a", "b", "c"] 不改变数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.sort((a, b) => b - a));// [5, 4, 3, 2, 1]
console.log(arr);// [5, 4, 3, 2, 1] 改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.reverse());// [5, 4, 3, 2, 1]
console.log(arr);// [5, 4, 3, 2, 1] 改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.every(currentValue => currentValue > 1));// false
console.log(arr);// 不改变原数组
let arr = [1, 2, 3 ,4 ,5];
console.log(arr.some(currentValue => currentValue > 1));// true
console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.filter(currentValue => currentValue > 2));// [3, 4, 5]
console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.find(currentValue => currentValue > 2));// 3
console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.findIndex(currentValue => currentValue > 2));// 2
console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.includes(2));// true
console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.indexOf(2));// 1
console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
let arr = [1, 2, 3, 2, 1];
console.log(arr.lastIndexOf(2));// 3
console.log(arr);// [1, 2, 3, 2, 1] 不改变原数组
let arr = [1, 2, 3, 4, 5];
console.log(arr.fill(0, 0, 5));// [0, 0, 0, 0, 0]
console.log(arr);// [0, 0, 0, 0 ,0] 改变数组
let arr = [1, 2, [3, 4, [5]]];
console.log(arr.flat(2));// [1, 2, 3, 4, 5]
console.log(arr);// [1, 2, [3, 4, [5]]] 不改变原数组
let arr = [1, 2, 3, 4, 5];
let iterator = arr.keys();
for (const key of iterator) {
console.log(key);
// 0
// 1
// 2
}
console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
let arr = [1, 2, 3, 1, 1, 1, 3, 5, 3];
let obj = {};
let newArr = [];
arr.forEach(v => {
if(!ogj[v]) {
ogj[v] = 1;
newArr.push(v);
}
})
console.log(newArr);// [1, 2, 3, 5]
let arr = [1, 2, 3, 1, 1, 1, 3, 5, 3];
let newArr = Array.from(new Set(arr));
// let newArr = [...(new Set(arr))];// 使用ES6解构赋值
console.log(newArr);// [1, 2, 3, 5]
let arr = [1, 2, [3, 4, [5]]];
let newArr = arr.flat(2);
console.log(newArr);// [1, 2, 3, 4, 5]
function _flat(arr, maxN = 1, curN = 0) {
let newArr = [];
if (curN >= maxN) return arr;
arr.forEach((v, i, array) => {
if (Array.isArray(v)) {
newArr.push(..._flat(v, maxN, curN + 1));
} else newArr.push(v);
})
return newArr;
}
let arr = [1, 2, [3, 4, [5]]];
let newArr = _flat(arr, 1);// 扁平化一层
console.log(newArr);// [1, 2, 3, 4, [5]]
let s = "ASASRKIADAA";
let arr = [];
let base = 65;// A-Z 65-90 a-z 97-122
Array.prototype.forEach.call(s, (v) => {
let ascii = v.charCodeAt(0) - base;
if (arr[ascii]) {
++arr[ascii];
} else arr[ascii] = 1;
})
let max = 0;
let maxIndex = 0;
arr.forEach((v, i) => {
if (v > max) {
max = v;
maxIndex = i;
}
})
console.log(String.fromCharCode(maxIndex + base), arr[maxIndex]);// A 5
let arr = [1, 2, 3, 1, 1, 1, 3, 5, 3];
let max = -Infinity;
arr.forEach(v => {
if (v > max) max = v;
})
console.log(max);// 5
let arr = [1, 2, 3, 1, 1, 1, 3, 5, 3];
let max = Math.max(...arr);
console.log(max);// 5
let arr = [1, 2, 3, 1, 1, 1, 3, 5, 3];
let max = arr.reduce((a, v) => {
return a > v ? a : v;
})
console.log(max);// 5
let arr = [1, 2, 3, 4, 5];
let newArr = [];
arr.forEach(v => newArr.push(v));
console.log(newArr);// [1, 2, 3, 4, 5]
let arr = [1, 2, 3, 4, 5];
let newArr = [].concat(arr);
console.log(newArr);// [1, 2, 3, 4, 5]
let arr = [1, 2, 3, 4, 5];
let newArr = arr.slice(0);
console.log(newArr);// [1, 2, 3, 4, 5];
function randomInt(a, b) {
return Number.parseInt(Math.random() * (b-a) + a);
}
let arr = [1, 2, 3, 4, 5];
let N = arr.length;
arr.forEach((v, i, arr) => {
let ran = randomInt(0, N);
[arr[i], arr[ran]] = [arr[ran], arr[i]];
})
console.log(arr);
let arr = [1, 2, 3, 4, 5];
arr.sort((v1, v2) => {
return Math.random() >= 0.5 ? 1 : -1;
})
console.log(arr);
Das obige ist der detaillierte Inhalt vonKlassische Techniken für JavaScript-Array-Operationen (organisiert und gemeinsam genutzt). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!