摘要:如果沒有符合條件的成員,則返回返回查找到的該成員該方法與類似,對數組中的成員依次執行函數,直至找到第一個返回值為的成員,然后返回該成員的索引。
摘要
最近學習了JS數組的基礎知識,在這里呢總結一下,包括js數組的屬性與方法,js數組常常遇到的一些問題,小編通過查閱一些網上的知識,把關于數組的東西進行了羅列,希望各位大神多多指點!
數組屬性length
length屬性表示數組的長度,即其中元素的個數。
JavaScript數組的length屬性是可變的,當length屬性被設置得更大時,整個數組的狀態事實上不會發生變化,僅僅是length屬性變大;當length屬性被設置得比原來小時,則原先數組中索引大于或等于length的元素的值全部被丟失。
prototype
返回對象類型原型的引用。prototype 屬性是 object 共有的。
一般用來給數組實例添加方法。
constructor
表示創建對象的函數。
說明:constructor 屬性是所有具有 prototype 的對象的成員。constructor 屬性保存了對構造特定對象實例的函數的引用。
創建數組
// 數組實例的創建 var arr = [];//創建空數組 var arr = [1,"{1,2}","string"];//創建一個數組并賦值 var arr = new Array(); //創建一個空數組 [] var arr = new Array(5); //創建一個length為5的數組 [undefined, undefined, undefined, undefined, undefined] var arr = new Array(1,2,3,4,5); //創建數組并賦值 [1,2,3,4,5] var arr = Array.of(7); // 創建數組并賦值 [7] var arr = Array.of(1, 2, 3); // 創建數組并賦值 [1, 2, 3]
檢測數組
//判斷一個對象是不是數組 var arr = [1,8,9]; /* 方法一 instanceof是Java、php的一個二元操作符(運算符),和==,>,<是同一類東西,它的作用是判斷其左邊對象是否為其右邊類的實例,返回boolean類型的數據 */ if(arr instanceof Array){} /* 方法二 prototype 屬性使您有能力向對象添加屬性和方法 */ if(Object.prototype.toString.call(arr) == "[object Array]")}{} //方法三 這種是最常用的方法 if(Array.isArray(arr)){} /* 方法四 constructor 屬性返回對創建此對象的數組函數的引用,Construction代表類中的一個構造方法,這個方法封裝了類的定義 */ if(arr.constructor == Array){}數組方法
① isArray()
Array.isArray(obj) 檢測對象是否 Array(數組) ,是則返回true,否則為false。
② from()
Array.from(arrayLike, mapFn, thisArg)
該方法從一個類似數組或可迭代對象創建一個新的數組實例。參數 arrayLike 是想要轉換成真實數組的類數組對象或可遍歷對象。mapFn是可選參數,如果指定了該參數,則最后生成的數組會經過該函數的加工處理后再返回。thisArg是可選參數,為執行 mapFn 函數時 this的值。
所謂類似數組的對象,本質特征只有一點,即必須有length屬性。因此,任何有length屬性的對象,都可以通過Array.from方法轉為數組。見下面的小例子:
var arrayLike = { 0: "a", 1: "b", 2: "c", length: 3 } var arrayLike2 = {length: 3} var str = "abcd" var newArray = Array.from(arrayLike) //["a", "b", "c"] var newArray2 = Array.from(arrayLike2) // [undefined, undefined, undefined] var newArray3 = Array.from(str) // ["a", "b", "c", "d"] console.log(newArray); console.log(newArray2); console.log(newArray3);
③ of();
Array.of(item,.....) 該方法用于創建數組實例。該方法用于替代 Array() 或 new Array()。Array.of() 和 Array 構造函數之間的區別在于處理整數參數:Array.of(7) 創建一個具有單個元素 7 的數組,而 Array(7) 創建一個包含 7 個 undefined 元素的數組。
eg:
var a1 = Array(7); var a2 = Array(1,2,12); var a3 = Array.of(7); var a4 =Array.of(1,2,12); console.log(a1); console.log(a2); console.log(a3); console.log(a4);數組實例方法
數組的轉換
① 數組轉換成字符串 Array.join(separator);.
把數組轉換成字符串,先把數組中的每個元素轉換成字符串,然后再用 separator 分隔符把它們鏈接在一起,separator 分隔符默認是逗號 “,”,要想做到無間隔鏈接,可以使用空字符串作為 separator:見下面的例子:
var arr = [1,2,3,4,5] //默認符號 "," var a1 = arr.join();//1,2,3,4,5 //自定義符號“ | ” var a2=arr.join("|") //"1|2|3|4|5" // 沒有符號,用空字符串 var a3=arr.join("") //12345 console.log(a1); console.log(a2); console.log(a3);
② 字符串轉換成數組 a.split();
var arr = [1,2,3,4,5] //arr 轉換成字符串并賦值給 a var a = arr.join(); // 再把 a 轉換成 數組,并用“ , ”隔開 var b = a.split(","); console.log(b);
棧方法 (push pop)
Array.push(item......)將一個或多個新元素添加到數組結尾,并返回數組新長度。
var arr = ["Orange","Apple"]; var a = arr.push("banana","Mango"); console.log(a);//返回數值長度為 4
Array.pop() 移除最后一個元素并返回該元素值。
var arr = ["Orange","Apple"]; var a = arr.pop(); console.log(a);// 移除最后一個元素 返回最后一個值Apple
隊列方法 (unshift shift)
Array.unshift(item...);將一個或多個新元素添加到數組開始,數組中的元素自動后移,返回數組新長度。
var arr = ["Orange","Apple"]; var a = arr.unshift("banana"); console.log(a);// 返回新數組的長度為 3
Array.shifit();移除最前一個元素并返回該元素值,數組中元素自動前移.如果這個數組是空的,它會返回undefined。shift 通常比 pop 慢的多。
var arr = ["Orange","Apple","banana"]; var arr1 = []; var a1 = arr1.shift(); var a2 = arr.shift(); console.log(a1);// 空數組返回undefined console.log(a2);// 移除第一個元素,并返回該元素 Orange
重排序方法(reverse, sort)
Array.reverse() 顛倒數組的順序
var arr = ["Orange","Apple","banana"]; var a = arr.reverse(); console.log(a);
Array.sort() 給數組排序, 默認升序。 sort 默認會將數組內容視為字符串來排序,所以對數字排序時默認的排序規則會錯的離譜,看下面的例子是怎么錯的:
var arr = [2,4,10,6,8,20]; var a = arr.sort(); console.log(a);
解決這種按照字符串來排序的方法就是給sort帶入個比較函數來替代原來默認的比較方法,比較方法接受兩個參數,如果兩個參數相等則返回0,如果第一個參數應該排在前面則返回一個負數,如果第二個參數應該排在前面則返回一個正數:
var arr = [2,4,10,6,8,20]; var a = arr.sort(function(a,b){ return a-b; }); console.log(a);
操作方法 ( concat, slice, splice, copyWithin, fill )
Array.concat(arr);該方法產生一份 arr的潛復制,并將多個數組(也可以是字符串,或者是數組和字符串的混合)附加在其后連接為一個數組,返回連接好的新的數組。
var a = [1,2,3]; var b = ["string"]; var arr = a.concat(b); console.log(arr);
Array.slice(start,end) 截取數組 ,如果沒有 end ,則輸出 start
之后的所有元素,這里遵循數學上的思想(左閉右開),意思就是不包括 end --------[ )
var a = [1,2,3]; var b = ["string"]; var arr = a.concat(b); var arr1 = arr.slice(1, 3); console.log(arr1);
Array.splice(start,deleteCount,item...),該方法從 數組 中移除一個或多個元素,并將新的 item插入至移除元素的開始位置, 參數 start 是移除元素的開始位置,deleteCount 是要移除的元素的個數,item是要被插入的元素。它返回一個包含被移除元素的數組。
① 添加新的元素
var fruits = ["Banana", "Orange", "Apple", "Mango"]; //在第三個元素的位置插入新的元素 fruits.splice(2,0,"Lemon","Kiwi"); console.log(fruits);
② 刪除某個元素并添加新的元素
var fruits = ["Banana", "Orange", "Apple", "Mango"]; //先移除從第二個位置開始后面的兩個元素,并把新的元素添加到第二個位置 fruits.splice(1,2,"Lemon") console.log(fruits);
Array.copyWithin(target,start,end)
target必須有的,復制到指定目標的索引位置(開始替換數據的位置),start可選,元素復制的起始位置,end 停止復制的索引位置,默認為 Array.length 返回值是數組
var fruits = ["Banana", "Orange", "Apple", "Mango", "Kiwi", "Papaya"]; //復制數組的前面兩個元素到第三和第四個位置上,這里也遵循左閉右開的思想,也就是 strat=0,end=2 這樣理解 [0,2) fruits.copyWithin(2, 0, 2); console.log(fruits);
Array.fill(value,start,end)
fill()方法用于將一個固定值替換數組的元素,value是必選的,start可選,開始填充的位置,end可選,表示停止填充位置(默認為Array.length),返回的是數組
var a = [1,2,3,4,6]; console.log(a.fill(5,2,4) );
位置方法 (indexOf, lastIndexOf, includes)
Array.indexOf(item,start)
item是必須要查找的元素,start 可選,規定在字符串中開始檢索的位置,合法取值為 0 到 array.length-1 ,如果沒有這個值,則從首字符開始查找,返回值為Number
var arr = ["Banana", "Orange", "Apple", "Mango", "Kiwi"]; var a = arr.indexOf("Orange"); console.log(a);//返回值為 1
Array.lastIndexOf(item,start)
和indexOf 類似 唯一區別就是他是倒著數,strat的默認值為 array.length-1 ,注意該方
法在比較查找項與數組中每一項時,會使用全等操作符(===),也就是要求查找的項必須嚴格相等
var arr = ["Banana", "Orange", "Apple", "Mango", "Kiwi"]; var a = arr.lastIndexOf("Kiwi"); console.log(a);//返回值為 4
Array.includes(searchElement, fromIndex)
includes() 方法用來判斷一個數組是否包含一個指定的值,如果是返回 true,否則false.
fromIndex可選。從該索引處開始查找 searchElement。如果為負值,則按升序從 array.length +fromIndex 的索引開始搜索。默認為 0。
var arr = ["Banana", "Orange", "Apple", "Mango", "Kiwi"]; var a = arr.includes("Apple",-2);//如果為fromIndex為負值,則數組的總長度 arr.length + fromIndex 就為當前我們要從這個位置開始檢索的位置 console.log(a);// 返回 false
迭代方法 (every, some, filter, forEach, map, find, findIndex, entries, keys, values)
Array.every(function(currentValue,index,arr), thisValue)
這個方法用于檢索數組中所有的元素是否滿足某個條件,若滿足,則返回true ,剩余元素不用繼續檢測,否則為false
var arr = [18,16,17,20]; var a = arr.every(function(item){ return item > 18; }); console.log(a);//返回false
Array.some(function(currentValue,index,arr), thisValue)
這個方法用于檢索數組中的元素是否滿足某個條件,若有一個滿足,則返回true ,剩余元素不用繼續檢測,都不滿足返回false
var arr = [18,16,17,20]; var a = arr.some(function(item){ return item > 18; }); console.log(a);//返回 true
Array.filter(function(currentValue,index,arr), thisValue)
對數組中的每一項運行給定函數,返回該函數會返回 true 的項組成的數組
var arr = [18,16,17,20]; var a = arr.filter(function(item){ return item > 17; }); console.log(a);//返回 一個檢索過后的新數組
Array.forEach(function(currentValue, index, arr), thisValue)
對數組中的每一項運行給定函數,這個方法的返回值為undefined;
array.map(function(currentValue,index,arr), thisValue)
對數組中的每一項運行給定函數,返回每次函數調用組成的數組
var arr = [4,16,25,36]; var a = arr.map(function(item){ return Math.sqrt(item); }); console.log(a);//返回數組元素的平方根
Array.find(function(currentValue, index, arr),thisValue)
該方法對數組所有成員依次執行函數,直到找出第一個返回值為 true 的成員,然后返回該成員。如果沒有符合條件的成員,則返回 undefined
var arr = [4,16,25,36]; var a = arr.find(function(item){ return item == 25; }); console.log(a);//返回查找到的該成員 25
Array.findIndex(function(currentValue, index, arr), thisValue)
該方法與 Arr.find() 類似,對數組中的成員依次執行 函數,直至找到第一個返回值為 true 的成員,然后返回該成員的索引。如果沒有符合條件的成員,則返回 -1
var arr = [4,16,25,36]; var a = arr.findIndex(function(item){ return item == 25; }); console.log(a);//返回查找到的該成員的索引值 2
Array.entries()Array.keys()
Array.values()
這三個方法都返回一個新的Array Iterator對象,可以用for...of循環進行遍歷,區別是keys()是對鍵名的遍歷、values()是對鍵值的遍歷,entries()是對鍵值對的遍歷
歸并方法(reduce, reduceRight)
Array.reduce(function(total, currentValue, currentIndex, arr),
initialValue)
reduce() 方法接收一個函數作為累加器,數組中的每個值(從左到右)開始縮減,最終計算為一個值
var arr = [12,20,10]; var a = arr.reduce(function(total,item){ return total+item; }); console.log(a);//返回和的結果為 42
reduceRight() 方法的功能和 reduce() 功能是一樣的,不同的是 reduceRight()
從數組的末尾向前將數組中的數組項做累加
var arr = [12,20,10]; var a = arr.reduceRight(function(total,item){ return total+item; }); console.log(a);//返回和的結果為 42
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/116916.html
摘要:語法數組刪除數組的最后一項語法數組在數組的最末添加一項語法數組刪除數組的首項語法數組在數組的首部添加一項案例分析 1:數組的指針操作: 語法:current(數組) 當前指針指向的單元值(默認是第零個)語法 next(數組) 當前指針往下移動一幀語法 prev(數組) 當前指針往前移動一個指針語法 end(array) 將當前指針移動到最后一項語法 ...
摘要:設置首字母大寫算法挑戰返回一個字符串確保字符串的每個單詞首字母都大寫,其余部分小寫。確認末尾字符算法檢查一個字符串是否以指定的字符串結尾。刪除數組中特定值算法挑戰刪除數組中的所有的假值。 在w3cschool上看到了這些初級算法題目,自己先嘗試做了一下,不會的也會查看一下別人的借鑒一下思路,更多的幫助自己熟悉字符串和數組方法的應用.如果您有更好的解法,可以指出來還有中級算法題目和后面的...
摘要:從數組索引為開始刪除元素,直到對數組元素運用指定方法為為止。對兩個數組的元素分別調用指定方法后,返回以運行結果為判定基準的并集,并集是原始數組元素的并集而不是運行結果的并集。 原文地址:JavaScript30秒, 從入門到放棄之Array(六)博客地址:JavaScript30秒, 從入門到放棄之Array(六) 水平有限,歡迎批評指正 tail Returns all elem...
摘要:下面這條語句將導致語法錯誤變量名允許包含字母數字美元符號和下劃線但第一個字符不允許是數字??梢园岩恍┎紶栔荡嫒胍粋€數組,還可以把一組數值存入一個數組甚至可以把這種數據類型混在一起存入一個數組數組元素還可以是變量這將把數組的第一個元素賦值為。 執行Javascript的方式 第一種方式是將JS代碼放到 < head > 標簽中的 < script > 標簽之間: ...
摘要:下面這條語句將導致語法錯誤變量名允許包含字母數字美元符號和下劃線但第一個字符不允許是數字??梢园岩恍┎紶栔荡嫒胍粋€數組,還可以把一組數值存入一個數組甚至可以把這種數據類型混在一起存入一個數組數組元素還可以是變量這將把數組的第一個元素賦值為。 執行Javascript的方式 第一種方式是將JS代碼放到 < head > 標簽中的 < script > 標簽之間: ...
閱讀 2132·2023-04-26 03:06
閱讀 3580·2023-04-26 01:51
閱讀 2084·2021-11-24 09:38
閱讀 2451·2021-11-17 17:00
閱讀 2323·2021-09-28 09:36
閱讀 940·2021-09-24 09:47
閱讀 2586·2019-08-30 15:54
閱讀 1553·2019-08-30 15:44