


Teknik klasik untuk operasi tatasusunan JavaScript (tersusun dan dikongsi)
Artikel ini membawakan anda beberapa operasi yang berkaitan pada tatasusunan dalam JavaScript, terutamanya termasuk kaedah prototaip objek Tatasusunan dan operasi biasa seperti penyahduplikasi, meratakan, pengisihan, dll. Saya harap ia akan membantu anda.
Operasi tatasusunan JavaScript, terutamanya termasuk kaedah prototaip objek Tatasusunan dan operasi biasa seperti penyahduplikasi, perataan, pengisihan, dll.
Prototaip. [, thisArg])
panggilan balik ialah fungsi yang dilaksanakan untuk setiap elemen dalam tatasusunan Fungsi ini menerima satu hingga tiga parameter currentValue ialah. sedang diproses dalam tatasusunan Tunggu indeks elemen semasa
- tatasusunan pilihan [menunjukkan tatasusunan sedang dikendalikan]
- arg pilihan ini [ apabila melaksanakan fungsi panggil balik, gunakan Sebagai nilai ini, parameter ini akan diabaikan apabila menggunakan fungsi anak panah]
- forEach() melaksanakan fungsi yang diberikan sekali untuk setiap elemen tatasusunan
- peta
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]不改变原数组
panggilan balik ialah fungsi yang dilaksanakan untuk setiap elemen tatasusunan Fungsi menerima satu hingga tiga parameterelemen semasa sedang diproses dalam tatasusunan Nilai semasa.
- indeks pilihan [indeks unsur semasa sedang diproses dalam tatasusunan]
- tatasusunan pilihan [tatasusunan sedang dikendalikan]
- thisArg pilihan [digunakan sebagai nilai ini apabila melaksanakan fungsi panggil balik, fungsi ini akan diabaikan apabila menggunakan fungsi anak panah]
- map() mencipta tatasusunan baru, hasilnya ialah Nilai pulangan selepas fungsi yang disediakan dipanggil sekali untuk setiap elemen dalam tatasusunan
- tolak
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]不改变原数组
push() menambah satu atau lebih elemen pada hujung tatasusunan dan mengembalikan Panjang
poppop() mengalih keluar elemen terakhir daripada tatasusunan dan mengembalikan nilai daripada elemen apabila tatasusunan kosong Mengembalikan tidak dapat ditentukan, kaedah ini menukar panjang tatasusunanlet 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() mengalih keluar elemen pertama daripada tatasusunan, Dan mengembalikan nilai elemen, kaedah ini akan menukar tatasusunan asallet arr = [1, 2, 3, 4, 5]; console.log(arr.pop());// 5 console.log(arr);// [1, 2, 3, 4] 改变原数组
nyahshift
arr.unshift(element1[, .. ., elementN])unshift() menambah satu atau lebih elemen pada permulaan tatasusunan dan mengembalikan panjang tatasusunan ini 🎜>let arr = [1, 2, 3, 4, 5] console.log(arr.shift());// 1 console.log(arr);// [2, 3, 4, 5] 改变原数组
splice
arrar.splice(start[, deleteCount[, item1[, item2[, ...]]]] )
mulakan pengubahsuaian yang ditentukan Kedudukan permulaan elemen dan bersamaan dengan tatasusunan.length-1); Jika nilai mutlak nombor negatif lebih besar daripada panjang tatasusunan, ini bermakna kedudukan permulaan ialah kedudukan 0
let arr = [1, 2, 3, 4, 5] console.log(arr.unshift(-1, 0));// 7 console.log(arr);// [-1, 0, 1, 2, 3, 4, 5] 改变原数组
item1, item2, ... pilihan [elemen untuk ditambahkan pada tatasusunan, dari mula Kedudukan permulaan Jika tidak dinyatakan, splice() hanya akan memadamkan elemen tatasusunan] splice() mengubah suai tatasusunan dengan memadam atau menggantikan elemen sedia ada atau menambah elemen baharu pada tempatnya, dan mengembalikan tatasusunan dalam bentuk kandungan yang diubah suai, kaedah ini akan menukar tatasusunan asal
hiris
arr.slice([mulakan[, tamat]])
mulakan pilihan [indeks pada permulaan pengekstrakan] Ekstrak tatasusunan asal elemen bermula dari indeks ini Jika parameter ini adalah nombor negatif, ia bermakna bermula dari beberapa elemen terakhir dalam tatasusunan asal Jika permulaan ditinggalkan , maka hirisan bermula dari indeks 0 jika permulaan lebih besar daripada panjang asal tatasusunan, tatasusunan kosong akan dikembalikan
let arr = [1, 2, 3, 4, 5] console.log(arr.splice(1, 1));// [2] console.log(arr);// [1, 3, 4, 5] 改变原数组
slice() mengembalikan objek tatasusunan baharu Objek ini ialah salinan cetek tatasusunan asal yang ditentukan oleh permulaan dan penghujung, termasuk tatasusunan asal tidak akan diubah
concat
biar new_array = old_array.concat(value[, value2[, ...[, valueN]]])
valueN pilihan [], menggabungkan tatasusunan atau nilai ke dalam tatasusunan baharu Jika parameter valueN diabaikan, concat akan mengembalikan salinan cetek tatasusunan sedia ada yang dipanggil
.concat()用于合并两个或多个数组, 此方法不会更改现有数组, 而是返回一个新数组
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] 不改变原数组
join
arr.join([separator])
separator可选 指定一个字符串来分隔数组的每个元素
join()将一个数组(或一个类数组对象)的所有元素连接成一个字符串并返回这个字符串. 如果数组只有一个项目, 那么将返回该项目而不使用分隔符
let arr = ['a', 'b', 'c']; console.log(arr.join("&"));// a&b&c console.log(arr);// ["a", "b", "c"] 不改变数组
sort
arr.sort([compareFunction])
compareFunction可选 用来指定按某种顺序进行排列的函数. 如果省略, 元素按照转换为第字符串的各个字符的Unicode进行排序
firstEl第一个用于比较的元素
secondEl第二个用于比较的元素
sort()用原地算法对数组的元素进行排序, 并返回数组. 默认排序顺序是在将元素转换为字符串, 然后比较它们的UTF-16代码单元值序列时构建的
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] 改变原数组
reverse
reverse()将数组中元素的位置颠倒, 并返回该数组, 该方法会改变原数组
let arr = [1, 2, 3, 4, 5]; console.log(arr.reverse());// [5, 4, 3, 2, 1] console.log(arr);// [5, 4, 3, 2, 1] 改变原数组
every
every()测试一个数组内的所有元素是否都能通过某个指定函数的测试, 返回一个布尔值
let arr = [1, 2, 3, 4, 5]; console.log(arr.every(currentValue => currentValue > 1));// false console.log(arr);// 不改变原数组
some
some()测试数组中是不是至少有1个元素通过了提供的测试函数, 返回一个Boolean类型的值
let arr = [1, 2, 3 ,4 ,5]; console.log(arr.some(currentValue => currentValue > 1));// true console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
filter
filter()创建一个新数组, 其包含通过所提供的测试函数的所有元素
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] 不改变原数组
find
find()返回数组中满足提供的测试函数的第一个元素的值, 否则返回undefined
let arr = [1, 2, 3, 4, 5]; console.log(arr.find(currentValue => currentValue > 2));// 3 console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
findIndex
findIndex()返回数组中满足提供的测试函数的第一个元素的索引, 否则返回-1
let arr = [1, 2, 3, 4, 5]; console.log(arr.findIndex(currentValue => currentValue > 2));// 2 console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
includes
includes()用来判断一个数组是否包含一个指定的值, 如果包含则返回true, 否则返回false
let arr = [1, 2, 3, 4, 5]; console.log(arr.includes(2));// true console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
indexOf
indexof()返回指定元素在数组中的第一个索引, 否则返回-1
let arr = [1, 2, 3, 4, 5]; console.log(arr.indexOf(2));// 1 console.log(arr);// [1, 2, 3, 4, 5] 不改变原数组
lastIndexOf
lastIndexOf()返回指定元素在数组中的的最后一个索引, 如果不存在则返回-1
let arr = [1, 2, 3, 2, 1]; console.log(arr.lastIndexOf(2));// 3 console.log(arr);// [1, 2, 3, 2, 1] 不改变原数组
fill
fill()用一个固定值填充一个数组从起始索引到终止索引到全部元素, 不包括终止索引
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] 改变数组
flat
flat()会按照一个可指定的深度递归遍历数组, 并将所有元素与遍历到的子数组中的元素合并为一个新数组返回
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]]] 不改变原数组
keys
keys()返回一个包含数组中每个索引键的Array Iterator对象
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]
使用Set
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]
扁平化数组
使用flat
let arr = [1, 2, [3, 4, [5]]]; let newArr = arr.flat(2); console.log(newArr);// [1, 2, 3, 4, 5]
递归实现flat
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]]
统计一个字符串中出现最多的字符
使用数组将字符的ASCII码作为key制作桶
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
使用Math
let arr = [1, 2, 3, 1, 1, 1, 3, 5, 3]; let max = Math.max(...arr); console.log(max);// 5
使用reduce
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
拷贝数组
遍历数组使用push
let arr = [1, 2, 3, 4, 5]; let newArr = []; arr.forEach(v => newArr.push(v)); console.log(newArr);// [1, 2, 3, 4, 5]
使用concat
let arr = [1, 2, 3, 4, 5]; let newArr = [].concat(arr); console.log(newArr);// [1, 2, 3, 4, 5]
使用slice
let arr = [1, 2, 3, 4, 5]; let newArr = arr.slice(0); console.log(newArr);// [1, 2, 3, 4, 5];
随机打乱一个数组
随机交换N次
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);
【相关推荐:javascript学习教程】
Atas ialah kandungan terperinci Teknik klasik untuk operasi tatasusunan JavaScript (tersusun dan dikongsi). Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Alat AI Hot

Undresser.AI Undress
Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover
Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool
Gambar buka pakaian secara percuma

Clothoff.io
Penyingkiran pakaian AI

Video Face Swap
Tukar muka dalam mana-mana video dengan mudah menggunakan alat tukar muka AI percuma kami!

Artikel Panas

Alat panas

Notepad++7.3.1
Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina
Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1
Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6
Alat pembangunan web visual

SublimeText3 versi Mac
Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Topik panas

Panduan untuk Sempadan Jadual dalam HTML. Di sini kita membincangkan pelbagai cara untuk menentukan sempadan jadual dengan contoh Sempadan Jadual dalam HTML.

Ini ialah panduan untuk Nested Table dalam HTML. Di sini kita membincangkan cara membuat jadual dalam jadual bersama-sama dengan contoh masing-masing.

Panduan untuk HTML margin-kiri. Di sini kita membincangkan gambaran keseluruhan ringkas tentang HTML margin-left dan Contoh-contohnya bersama-sama dengan Pelaksanaan Kodnya.

Panduan untuk Susun Atur Jadual HTML. Di sini kita membincangkan Nilai Susun Atur Jadual HTML bersama-sama dengan contoh dan output n perincian.

Panduan untuk Pemegang Tempat Input HTML. Di sini kita membincangkan Contoh Pemegang Tempat Input HTML bersama-sama dengan kod dan output.

Panduan kepada Senarai Tertib HTML. Di sini kami juga membincangkan pengenalan senarai dan jenis Tertib HTML bersama-sama dengan contoh mereka masing-masing

Panduan untuk Memindahkan Teks dalam HTML. Di sini kita membincangkan pengenalan, cara teg marquee berfungsi dengan sintaks dan contoh untuk dilaksanakan.

Panduan untuk Butang onclick HTML. Di sini kita membincangkan pengenalan, kerja, contoh dan onclick Event masing-masing dalam pelbagai acara.
