您好,登錄后才能下訂單哦!
本篇內(nèi)容主要講解“常用的JS數(shù)組函數(shù)整理”,感興趣的朋友不妨來看看。本文介紹的方法操作簡單快捷,實用性強(qiáng)。下面就讓小編來帶大家學(xué)習(xí)“常用的JS數(shù)組函數(shù)整理”吧!
instanceof
檢測一個對象是否是數(shù)組;(用來對付復(fù)雜數(shù)據(jù)類型;) // 簡單數(shù)據(jù)類型 typeof ; A instanceof B // A是不是B造出來的; 例: var arr = [1,2,3]; console.log(arr instanceof Array); //arr屬不屬于Array類型;
Array.isArray( )
Array.isArray(參數(shù)); // 判斷參數(shù)是不是數(shù)組,返回布爾值; 例: var arr = [1,2,3]; var num = 123; console.log(Array.isArray(arr)); //true console.log(Array.isArray(num)); //false
toString( )
數(shù)組.toString(); // 把數(shù)組變成字符串,去除了[],內(nèi)容用逗號鏈接; 例: var arr = ["aaa","bbb","ccc"]; console.log(arr.toString()); //返回 aaa,bbb,ccc
valueOf( )
數(shù)組.valueOf(); //返回數(shù)組本身; 例: var arr = ["aaa","bbb","ccc"]; console.log(arr.valueOf()); //返回數(shù)組本身 ["aaa","bbb","ccc"]
數(shù)組.join(參數(shù))
數(shù)組.join(參數(shù)); // 數(shù)組中的元素可以按照參數(shù)進(jìn)行鏈接變成一個字符串; console.log(arr.join()); //和toString()一樣用逗號鏈接 console.log(arr.join("|")); //用參數(shù)鏈接 console.log(arr.join("&")); //用參數(shù)鏈接 console.log(arr.join(" ")); //如果是空格,真的用空格鏈接 console.log(arr.join("")); //空字符是無縫連接
數(shù)組元素的添加和刪除
push( )和pop( )
1. 數(shù)組.push() //在數(shù)組的最末尾添加元素; 2. 數(shù)組.pop() //不需要參數(shù);在數(shù)組的最末尾刪除一項; 例: var arr = [1,2,3]; var aaa = arr.push("abc");//在數(shù)組的最末尾添加一個元素; console.log(arr);//元素被修改了 console.log(aaa);//返回值是數(shù)組的長度; aaa = arr.pop();//不需要參數(shù);在數(shù)組的最末尾刪除一項; console.log(arr);//元素被修改了 console.log(aaa);//被刪除的那一項
unshift( )和shift( )
1. 數(shù)組.unshift() //在數(shù)組的最前面添加一個元素; 2. 數(shù)組.shift() //不需要參數(shù);在數(shù)組的最前面刪除一項; 例: var arr = [1,2,3]; aaa = arr.unshift("abc");//在數(shù)組的最前面添加一個元素; console.log(arr);//元素被修改了 console.log(aaa);//返回值是數(shù)組的長度; aaa = arr.shift();//不需要參數(shù);在數(shù)組的最前面刪除一項; console.log(arr);//元素被修改了 console.log(aaa);//被刪除的那一項
數(shù)組元素排序
reverse( )
reverse() //翻轉(zhuǎn)數(shù)組 例: var arr1 = [1,2,3,4,5]; var aaa = arr1.reverse(); // [5,4,3,2,1]
sort( )
sort() // 數(shù)組中元素排序;(默認(rèn):從小到大) // 默認(rèn):按照首個字符的Unicode編碼排序;如果第一個相同那么就比較第二個... 例: var arr = [4,5,1,3,2,7,6]; var aaa =arr.sort(); console.log(aaa); // [1, 2, 3, 4, 5, 6, 7] console.log(aaa === arr);// true 原數(shù)組被排序了(冒泡排序) //默認(rèn)還可以排列字母; var arr2 = ["c","e","d","a","b"]; var bbb = arr2.sort(); console.log(bbb); // ["a", "b", "c", "d", "e"] console.log(bbb===arr2); // true 原數(shù)組被排序了(冒泡排序) sort() //數(shù)值大小排序方法,需要借助回調(diào)函數(shù); 例: var arr = [4,5,1,13,2,7,6]; //回調(diào)函數(shù)里面返回值如果是:參數(shù)1-參數(shù)2;升冪; 參數(shù)2-參數(shù)1;降冪; arr.sort(function (a,b) { return a-b; //升序 //return b-a; //降序 //return b.value-a.value; //按照元素value屬性的大小排序; }); console.log(arr); // [1, 2, 4, 5, 6, 7, 13]
sort( )底層原理
var aaa = bubbleSort([1,12,3], function (a,b) { // return a-b;//實參:array[j]-array[j+1]; return b-a;//實參:array[j+1]-array[j]; }); console.log(aaa); function bubbleSort(array,fn){ //外循環(huán)控制輪數(shù),內(nèi)循環(huán)控制次數(shù),都是元素個數(shù)-1; for(var i=0;i<array.length-1;i++){ for(var j=0;j<array.length-1-i;j++){//次數(shù)優(yōu)化,多比較一輪,少比較一次; //滿足條件交換位置; // if(array[j]>array[j+1]){//大于升冪排序;否則降冪; //a-b>0 和 a>b是一個意思; //b-a>0 和 a<b是一個意思; // if(array[j]-array[j+1]>0){//升冪排序 // if(array[j+1]-array[j]>0){//降冪排序 //把兩個變量送到一個函數(shù)中; if(fn(array[j],array[j+1])>0){ var temp = array[j]; array[j] = array[j+1]; array[j+1] = temp; } } } //返回數(shù)組 return array; }
數(shù)組元素的操作
concat( )
數(shù)組1.concat(數(shù)組2); // 鏈接兩個數(shù)組; var arr1 = [1,2,3]; var arr2 = ["a","b","c"]; var arr3 = arr1.concat(arr2); console.log(arr3) // [1, 2, 3, "a", "b", "c"]
slice( )
數(shù)組.slice(開始索引值,結(jié)束索引值); //數(shù)組截取; 例 : var arr = [1, 2, 3, "a", "b", "c"]; console.log(arr.slice(3)); //從索引值為3截取到最后;["a", "b", "c"] console.log(arr.slice(0,3)); //包左不包右;[1, 2, 3] console.log(arr.slice(-2)); //負(fù)數(shù)是后幾個;["b", "c"] console.log(arr.slice(3,0)); //如果前面的比后面的大,那么就是[];[] console.log(arr); //原數(shù)組不被修改;[1, 2, 3, "a", "b", "c"]
splice( )
數(shù)組.splice(開始索引值,刪除幾個,替換內(nèi)容1,替換內(nèi)容2,...); // 替換和刪除; //改變原數(shù)組;返回值是被刪除/替換的內(nèi)容 例: var arr = [1,2,3,4,5,6,"a", "b", "c"] arr.splice(5); //從索引值為3截取到最后;(刪除) console.log(arr); // [1, 2, 3, 4, 5] arr.splice(1,2); //(刪除指定個數(shù))從索引為1的開始刪除2個 console.log(arr); //[1, 4, 5] //替換 var arr = [1,2,3,4,5,6,"a", "b", "c"]; console.log(arr.splice(3,3,"aaa","bbb","ccc")); //(刪除指定數(shù)并替換) console.log(arr); // [1, 2, 3, "aaa", "bbb", "ccc", "a", "b", "c"] // 添加 arr.splice(3,0,"aaa","bbb","ccc");//(刪除指定個數(shù)) // console.log(arr);//截取或者替換之后的; [1, 2, 3, "aaa", "bbb", "ccc", "aaa", "bbb", "ccc", "a", "b", "c"]
indexOf / lastIndexOf
數(shù)組.indexOf(元素); // 給元素,查索引(從前往后) 數(shù)組.lastIndexOf(元素); // 給元素,查索引(從后往前) 例: var arr = ["a","b","c","d","c","b","b"]; console.log(arr.indexOf("b")); // 1 查到以后立刻返回 console.log(arr.lastIndexOf("b")); // 6 找到以后立刻返回 console.log(arr.indexOf("xxx")); // -1; 查不到就返回-1;
數(shù)組迭代(遍歷)
every()
對數(shù)組中每一項運行回調(diào)函數(shù),如果都返回true,every返回true, 如果有一項返回false,則停止遍歷 every返回false;不寫默認(rèn)返回false 像保鏢失誤一次,游戲結(jié)束!??! 例: 1. var arr = [111,222,333,444,555]; arr.every(function (a,b,c) { console.log(a); //元素 console.log(b); //索引值 console.log(c); //數(shù)組本身; console.log("-----"); //數(shù)組本身; //數(shù)組中元素賦值:c[b] = 值; a=有時候無法賦值; return true; }); 2. //every返回一個bool值,全部是true才是true;有一個是false,結(jié)果就是false var bool = arr.every(function (element, index, array) { //判斷:我們定義所有元素都大于200; //if(element > 100){ if(element > 200){ return true; }else{ return false; } }) alert(bool); //false
filter()
// 對數(shù)組中每一項運行回調(diào)函數(shù),該函數(shù)返回結(jié)果是true的項組成的新數(shù)組 // 新數(shù)組是有老數(shù)組中的元素組成的,return為ture的項; 例: var arr = [111,222,333,444,555]; var newArr = arr.filter(function (element, index, array) { //只要是奇數(shù),就組成數(shù)組;(數(shù)組中辨別元素) if(element%2 === 0){ return true; }else{ return false; } }) console.log(newArr); // [222, 444]
forEach()
// 和for循環(huán)一樣;沒有返回值; 例: var arr = [111,222,333,444,555]; var sum = 0; var aaa = arr.forEach(function (element,index,array) { console.log(element); // 輸出數(shù)組中的每一個元素 console.log(index); // 數(shù)組元素對應(yīng)的索引值 console.log(array); // 數(shù)組本身 [111, 222, 333, 444, 555] sum += element; //數(shù)組中元素求和; }); console.log(sum); // 數(shù)組元素加起來的和 console.log(aaa);//undefined;沒有返回值 所以返回undefined
map()
// 對數(shù)組中每一項運行回調(diào)函數(shù),返回該函數(shù)的結(jié)果組成的新數(shù)組 // return什么新數(shù)組中就有什么; 不return返回undefined; 對數(shù)組二次加工 例: var arr = [111,222,333,444,555]; var newArr = arr.map(function (element, index, array) { if(index == 2){ return element; // 這里return了 所以下面返回的值是333 } return element*100; // 返回的元素值都乘上100后的值 }) console.log(newArr); // [11100, 22200, 333, 44400, 55500]
some()
//對數(shù)組中每一項運行回調(diào)函數(shù),如果該函數(shù)對某一項返回true,則some返回true; 像殺手,有一個成功,就勝利了?。。? 例: var arr = [111,222,333,444,555]; var bool = arr.some(function (ele,i,array) { //判斷:數(shù)組中有3的倍數(shù) if(ele%3 == 0){ return true; } return false; }) alert(bool); //true ; 有一個成功就是true
數(shù)組清空
1. arr.length = 0; // (不好,偽數(shù)組無法清空) 2. arr.splice(0); // 偽數(shù)組沒有這個方法; 3. arr = []; // 可以操作偽數(shù)組; (推薦!)
// 偽數(shù)組: 就是長的像數(shù)組,但是沒有數(shù)組的方法;也不能添加和刪除元素; 例: // arguments fn(111,222,333); function fn(){ arguments.length = 0; // 無法清空 返回 [1, 2, 3] arguments.splice(0); // 會報錯 arguments.splice is not a function arguments = []; // 可以清空,返回空數(shù)組[] console.log(arguments); }
數(shù)組案例
1.將一個字符串?dāng)?shù)組輸出為|分割的形式,比如“劉備|張飛|關(guān)羽”。使用兩種方式實現(xiàn)
var arr = ["劉備","張飛","關(guān)羽"]; var separator = "|"; //通過for循環(huán)累加 var str = arr[0]; for(var i=1;i<arr.length;i++){ str += separator+arr[i]; } console.log(str); // 劉備|張飛|關(guān)羽 //join()可以把數(shù)組中的元素鏈接成字符串; console.log(arr.join("|")); // 劉備|張飛|關(guān)羽
2.將一個字符串?dāng)?shù)組的元素的順序進(jìn)行反轉(zhuǎn)。["a", "b", "c", "d"] -> [ "d","c","b","a"]。使用兩種種方式實現(xiàn)。提示:第i個和第length-i-1個進(jìn)行交換
// 數(shù)組.reverse() 方法 var arr = ["a", "b", "c", "d"]; console.log(arr.reverse()); // ["d", "c", "b", "a"] // 三種:1.正向遍歷,反向添加; 2.反向遍歷,正向添加; 3.元數(shù)組元素交換位置; for(var i=0;i<arr.length/2;i++){ var temp = arr[i]; arr[i] = arr[arr.length-1-i]; arr[arr.length-1-i] = temp; } console.log(arr);
3.工資的數(shù)組[1500, 1200, 2000, 2100, 1800],把工資超過2000的刪除
var arr = [1500, 1200, 2000, 2100, 1800]; //利用filter()形成一個數(shù)組;return true;組成的數(shù)組; var newArr = arr.filter(function (ele, i, array) { //2000以上返回false; if(ele<2000){ return true; }else{ return false; } }); console.log(newArr); // [1500, 1200, 1800]
4.["c", "a", "z", "a", "x", "a"]找到數(shù)組中每一個a出現(xiàn)的位置
var arr = ["c", "a", "z", "a", "x", "a"]; //遍歷數(shù)組(for/while/do...while) forEach(); arr.forEach(function (ele, index, array) { //如果元素等于“a”,那么就輸出索引值; if("a" === ele){ console.log(index); } });
5.編寫一個方法去掉一個數(shù)組的重復(fù)元素 (數(shù)組去重)
var arr = ["鳴人","鳴人","佐助","佐助","小櫻","小櫻"]; // 方法1: 思路:定義一個新數(shù)組,遍歷老數(shù)組,判斷,如果新數(shù)組里面沒有老數(shù)組的元素就添加,否則就不添加; var newArr = []; //遍歷老數(shù)組 arr.forEach(function (ele,index,array) { //檢測老數(shù)組中的元素,如果新數(shù)組中存在就不添加了,不存在才添加; if(newArr.indexOf(ele) === -1){//不存在就添加;(去新數(shù)組中查找元素索引值,如果為-1就是沒有) newArr.push(ele); } }); console.log(newArr); // ["鳴人", "佐助", "小櫻"]
到此,相信大家對“常用的JS數(shù)組函數(shù)整理”有了更深的了解,不妨來實際操作一番吧!這里是億速云網(wǎng)站,更多相關(guān)內(nèi)容可以進(jìn)入相關(guān)頻道進(jìn)行查詢,關(guān)注我們,繼續(xù)學(xué)習(xí)!
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。