Rumah hujung hadapan web tutorial js JavaScript的数组使用集合

JavaScript的数组使用集合

Mar 14, 2018 am 10:27 AM
javascript js berkumpul

这次给大家带来JavaScript的数组使用集合,JavaScript数组使用集合的注意事项有哪些,下面就是实战案例,一起来看一下。

1.join() 将数组中的所有元素转化为字符串并连接在一起

var a=[1,2,3,4];
a.join(); //"1,2,3,4"
Salin selepas log masuk

2.reverser() 将数组中的元素颠倒顺序,返回逆序的数组。

var a[1,2,3,4];
a.reverse(); //[4,3,2,1]
Salin selepas log masuk

3.sort() 将数组中的元素排序并返回排序后的数组。
当不带参数调用sort()时,数组元素以字母表顺序排序。

var a=['ant','Bug','cat','Dog'];
a.sort(); //["Bug", "Dog", "ant", "cat"]
a.sort(function(s,t){
   var s1=s.toLowerCase();
   var t1=t.toLowerCase();   if(s1<t1) return -1;   if(s1>t1) return 1;   return 0});//["ant", "BUg", "cat", "Dog"]
Salin selepas log masuk

4.concat() 创建并返回一个新数组,它的元素包括调用concat()的原始数组的元素和concat()的每个参数。如果这些参数中的任何一个自身是数组,则连接的是数组元素,而非数组本身。

var a=[1,2,3];a.concat(4,5);// [1, 2, 3, 4, 5]a.concat([4,5]);// [1, 2, 3, 4, 5]a.concat([4,5],[6,7]);// [1, 2, 3, 4, 5, 6, 7]a.concat([4,5],[6,[8,7]]);// [1, 2, 3, 4, 5, 6,[8,7]]
Salin selepas log masuk

5.slice() 返回指定数组的一个片段或子数组。它的两个参数分别指定了片段的开始和结束的位置。返回的数组包含第一个参数指定的位置和所有到但不含第二个参数指定的位置之间的所有数据元素。
如果只指定一个参数,返回的数组包含从开始位置到数组结尾的所有元素。
如果参数中出现负数,它表示相对于数组中最后一个元素的位置。例如:参数-1指定了最后一个元素,而-3指定了倒数第三个元素。
注意,slice()不会修改调用的数组。

var a=[1,2,3,4,5];a.slice(0,2);//[1, 2]a.slice(3);//[4, 5]a.slice(1,-1);//[2, 3, 4]a.slice(-3,-2);//[3]
Salin selepas log masuk

6.splice() 在数组中插入或删除元素的通用方法。不同于slice()和concat(),splice()会修改调用的数组。注意:splice()和slice()拥有非常相似的名字,但它们的功能却又本质的区别。
splice()能够从数组中删除元素,插入元素到数组中或者同事完成这两种操作。在插入或删除点之后的数组元素会根据需要增加或减小它们的索引值,因此数组的其他部分仍然保持连续。splice()的第一个参数指定了插入和(或)删除的起始位置。第二个参数指定了应该从数组中删除的元素的个数,如果省略第二个参数,从起始点开始到数组结尾的所有元素都将被删除。splice()返回一个由删除元素组成的数组,或者如果没有删除元素就返回一个空数组。

var a=[1,2,3,4,5,6,7,8];a.splice(4);//返回[[5, 6, 7, 8]],a是[1, 2, 3, 4]a.splice(1,2)//返回[2, 3],a是[1, 4, 5, 6, 7, 8]a.splice(1,1);//返回[2],a是 [1, 3, 4, 5, 6, 7, 8]
Salin selepas log masuk

7.push()和pop()
push()向数组尾部添加一个或多个元素。
pop()删除数组的最后一个元素。

8.unshift()和shift()
unshift()向数组头部添加一个或多个元素。
shift()删除数组的第一个元素。

9.toString()和toLocaleString()

[1,2,3].toString();//"1,2,3"[1,[2,&#39;c&#39;]].toString();//"1,2,c"
Salin selepas log masuk

toLocaleString()是toString()方法的本地化版本。它调用元素的toLocaleString()方法将每个数组元素转换为字符串,并使用本地化分隔符将这些字符串连接起来生成最终的字符串。

10.forEach()从头至尾遍历数组,为每个元素调用指定的函数。
传递的函数做为forEach()的第一个参数,然后forEach()使用三个参数调用该函数:数组元素,元素的索引和数组的本身。

var data=[1,2,3,4,5];//计算数组元素的和值var sum=0;
data.forEach(function(value){
sum+=value
});  
sum //15//每个数组元素的值加1data.forEach(function(value,index,arr){
arr[index]=value+1;
});
data  //[2, 3, 4, 5, 6]
Salin selepas log masuk

11.map()将调用的数组的每个元素传递给指定的函数,并返回一个数组,它包含函数的返回值
注意:传递给mao()的函数应该有返回值。map()返回的是新数组,不修改原来的数组。如果原来的数组是稀疏数组,返回的也是相同方式的稀疏数组,它们具有相同的长度,相同的缺失元素。

var a=[1,2,3];var b=a.map(function(value){return value*value;
});
b// [1, 4, 9]
Salin selepas log masuk

12 filter()返回符合条件的数组元素

var a=[1,2,3,5];var b=a.filter(function(value){return value>2;
});
b  // [3, 5]
Salin selepas log masuk

13.every()和some()
数组的逻辑判定,它们对数组元素应用指定的函数进行判定,返回true或false。
every()即数组中所有元素都符合筛选条件,则返回true.
some()即数组中存在元素符合筛选条件,则返回true;

var a =[1,2,3,4,5];
a.every(function(value){return value<10;
})  //true a中所有元素都小于10a.every(function(value){return value%2===0;
});//false a中不是所有元素都是偶数a.some(function(value){return value%2===0;
})//true a中存在偶数
Salin selepas log masuk

reduce()和reduceRight()
使用指定的函数将数组元素进行组合,生成单个值。
reduce()需要两个参数。
第一个是执行化简操作的函数。化简函数的任务就是用某种方法把两个值组合或化简为一个值,并返回化简后的值。第二个(可选)参数是一个传递给函数的初始值。
reduceRight()和reduce()使用方法一致,不同的是它按照数组索引从高到低(从右向左)处理数组。

var a=[1,2,3,4,5];var sum=a.reduce(function(x,y){return x+y;},0);
sum //15  数组求和var max=a.reduce(function(x,y){return x>y?x:y});
max // 5求最大值
Salin selepas log masuk

indexOf()和lastIndexOf()
indexOf()第一个符合条件的值的索引,如果没有,返回-1
lastIndexOf()最后一个符合条件的值的索引,如果没有,返回-1

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

Require.js详解

怎样实现node连接mysql的方法

JS的正则表达式如何使用

Javascript的单例模式

Atas ialah kandungan terperinci JavaScript的数组使用集合. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn

Alat AI Hot

Undresser.AI Undress

Undresser.AI Undress

Apl berkuasa AI untuk mencipta foto bogel yang realistik

AI Clothes Remover

AI Clothes Remover

Alat AI dalam talian untuk mengeluarkan pakaian daripada foto.

Undress AI Tool

Undress AI Tool

Gambar buka pakaian secara percuma

Clothoff.io

Clothoff.io

Penyingkiran pakaian AI

AI Hentai Generator

AI Hentai Generator

Menjana ai hentai secara percuma.

Artikel Panas

R.E.P.O. Kristal tenaga dijelaskan dan apa yang mereka lakukan (kristal kuning)
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Tetapan grafik terbaik
3 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Cara Memperbaiki Audio Jika anda tidak dapat mendengar sesiapa
4 minggu yang lalu By 尊渡假赌尊渡假赌尊渡假赌
WWE 2K25: Cara Membuka Segala -galanya Di Myrise
1 bulan yang lalu By 尊渡假赌尊渡假赌尊渡假赌

Alat panas

Notepad++7.3.1

Notepad++7.3.1

Editor kod yang mudah digunakan dan percuma

SublimeText3 versi Cina

SublimeText3 versi Cina

Versi Cina, sangat mudah digunakan

Hantar Studio 13.0.1

Hantar Studio 13.0.1

Persekitaran pembangunan bersepadu PHP yang berkuasa

Dreamweaver CS6

Dreamweaver CS6

Alat pembangunan web visual

SublimeText3 versi Mac

SublimeText3 versi Mac

Perisian penyuntingan kod peringkat Tuhan (SublimeText3)

Disyorkan: Projek pengesanan dan pengecaman muka sumber terbuka JS yang sangat baik Disyorkan: Projek pengesanan dan pengecaman muka sumber terbuka JS yang sangat baik Apr 03, 2024 am 11:55 AM

Teknologi pengesanan dan pengecaman muka adalah teknologi yang agak matang dan digunakan secara meluas. Pada masa ini, bahasa aplikasi Internet yang paling banyak digunakan ialah JS Melaksanakan pengesanan muka dan pengecaman pada bahagian hadapan Web mempunyai kelebihan dan kekurangan berbanding dengan pengecaman muka bahagian belakang. Kelebihan termasuk mengurangkan interaksi rangkaian dan pengecaman masa nyata, yang sangat memendekkan masa menunggu pengguna dan meningkatkan pengalaman pengguna termasuk: terhad oleh saiz model, ketepatannya juga terhad. Bagaimana untuk menggunakan js untuk melaksanakan pengesanan muka di web? Untuk melaksanakan pengecaman muka di Web, anda perlu biasa dengan bahasa dan teknologi pengaturcaraan yang berkaitan, seperti JavaScript, HTML, CSS, WebRTC, dll. Pada masa yang sama, anda juga perlu menguasai visi komputer yang berkaitan dan teknologi kecerdasan buatan. Perlu diingat bahawa kerana reka bentuk bahagian Web

Mengapakah sukar untuk melaksanakan fungsi seperti koleksi dalam bahasa Go? Mengapakah sukar untuk melaksanakan fungsi seperti koleksi dalam bahasa Go? Mar 24, 2024 am 11:57 AM

Sukar untuk melaksanakan fungsi seperti koleksi dalam bahasa Go, yang merupakan masalah yang menyusahkan ramai pembangun. Berbanding dengan bahasa pengaturcaraan lain seperti Python atau Java, bahasa Go tidak mempunyai jenis koleksi terbina dalam, seperti set, peta, dll., yang membawa beberapa cabaran kepada pembangun apabila melaksanakan fungsi pengumpulan. Mula-mula, mari kita lihat mengapa sukar untuk melaksanakan fungsi seperti koleksi secara langsung dalam bahasa Go. Dalam bahasa Go, struktur data yang paling biasa digunakan ialah hirisan dan peta Mereka boleh melengkapkan fungsi seperti koleksi, tetapi

Petua Pembangunan PHP dan JS: Kuasai Kaedah Melukis Carta Lilin Stok Petua Pembangunan PHP dan JS: Kuasai Kaedah Melukis Carta Lilin Stok Dec 18, 2023 pm 03:39 PM

Dengan perkembangan pesat kewangan Internet, pelaburan saham telah menjadi pilihan semakin ramai orang. Dalam perdagangan saham, carta lilin adalah kaedah analisis teknikal yang biasa digunakan Ia boleh menunjukkan trend perubahan harga saham dan membantu pelabur membuat keputusan yang lebih tepat. Artikel ini akan memperkenalkan kemahiran pembangunan PHP dan JS, membawa pembaca memahami cara melukis carta lilin saham dan menyediakan contoh kod khusus. 1. Memahami Carta Lilin Saham Sebelum memperkenalkan cara melukis carta lilin saham, kita perlu memahami dahulu apa itu carta lilin. Carta candlestick telah dibangunkan oleh orang Jepun

Tutorial JavaScript Mudah: Cara Mendapatkan Kod Status HTTP Tutorial JavaScript Mudah: Cara Mendapatkan Kod Status HTTP Jan 05, 2024 pm 06:08 PM

Tutorial JavaScript: Bagaimana untuk mendapatkan kod status HTTP, contoh kod khusus diperlukan: Dalam pembangunan web, interaksi data dengan pelayan sering terlibat. Apabila berkomunikasi dengan pelayan, kami selalunya perlu mendapatkan kod status HTTP yang dikembalikan untuk menentukan sama ada operasi itu berjaya dan melaksanakan pemprosesan yang sepadan berdasarkan kod status yang berbeza. Artikel ini akan mengajar anda cara menggunakan JavaScript untuk mendapatkan kod status HTTP dan menyediakan beberapa contoh kod praktikal. Menggunakan XMLHttpRequest

Hubungan antara js dan vue Hubungan antara js dan vue Mar 11, 2024 pm 05:21 PM

Hubungan antara js dan vue: 1. JS sebagai asas pembangunan Web; 2. Kebangkitan Vue.js sebagai rangka kerja hadapan 3. Hubungan pelengkap antara JS dan Vue; Vue.

Bagaimana untuk mendapatkan kod status HTTP dalam JavaScript dengan cara yang mudah Bagaimana untuk mendapatkan kod status HTTP dalam JavaScript dengan cara yang mudah Jan 05, 2024 pm 01:37 PM

Pengenalan kepada kaedah mendapatkan kod status HTTP dalam JavaScript: Dalam pembangunan bahagian hadapan, kita selalunya perlu berurusan dengan interaksi dengan antara muka bahagian belakang, dan kod status HTTP adalah bahagian yang sangat penting daripadanya. Memahami dan mendapatkan kod status HTTP membantu kami mengendalikan data yang dikembalikan oleh antara muka dengan lebih baik. Artikel ini akan memperkenalkan cara menggunakan JavaScript untuk mendapatkan kod status HTTP dan memberikan contoh kod khusus. 1. Apakah kod status HTTP bermakna kod status HTTP apabila penyemak imbas memulakan permintaan kepada pelayan, perkhidmatan tersebut

Panduan Praktikal untuk Kaedah Where dalam Koleksi Laravel Panduan Praktikal untuk Kaedah Where dalam Koleksi Laravel Mar 10, 2024 pm 04:36 PM

Panduan Praktikal Ke Mana Kaedah dalam Koleksi Laravel Semasa pembangunan rangka kerja Laravel, koleksi ialah struktur data yang sangat berguna yang menyediakan kaedah yang kaya untuk memanipulasi data. Antaranya, kaedah Where ialah kaedah penapisan yang biasa digunakan yang boleh menapis elemen dalam koleksi berdasarkan syarat yang ditetapkan. Artikel ini akan memperkenalkan penggunaan kaedah Where dalam koleksi Laravel dan menunjukkan penggunaannya melalui contoh kod tertentu. 1. Penggunaan asas kaedah Where

Java Iterator vs. Iterable: Satu langkah untuk menulis kod elegan Java Iterator vs. Iterable: Satu langkah untuk menulis kod elegan Feb 19, 2024 pm 02:54 PM

Antara muka Iterator Antara muka Iterator ialah antara muka yang digunakan untuk melintasi koleksi. Ia menyediakan beberapa kaedah, termasuk hasNext(), next() dan remove(). Kaedah hasNext() mengembalikan nilai Boolean yang menunjukkan sama ada terdapat elemen seterusnya dalam koleksi. Kaedah next() mengembalikan elemen seterusnya dalam koleksi dan mengeluarkannya daripada koleksi. Kaedah remove() mengalih keluar elemen semasa daripada koleksi. Contoh kod berikut menunjukkan cara menggunakan antara muka Iterator untuk mengulang koleksi: Listnames=Arrays.asList("John","Mary","Bob");Iterator

See all articles