js數組方法大全(下)

# js數組方法大全(下)

記錄一下整理的js數組方法,免得每次要找方法都找不到。圖片有點多,注意流量,嘻嘻!

本期分享

  • forEach()
  • map()
  • filer()
  • every()
  • some()
  • reduce()
  • reduceRight()
  • indexOf()
  • lastIndex()

上期分享

  • join()
  • reverse()
  • sort()
  • concat()
  • slice()
  • splice()
  • push()
  • pop()
  • unshift()
  • shift()
  • toString()
  • toLocaleString()

forEach() —>遍歷

  • 使用熱度:經常用
  • 是否改變原始數組:否
  • 返回:無
  • 參數:
參數位置 參數類型 是否必選 說明
1 function 三個參數分別是:數組元素、元素的索引、數組本身
  • 說明:該方法無法提前終止運行,如果要提前終止運行,只能使用try塊中,然後拋出一個異常。
  • 小技巧:如果數組是個數組對象形式可以直接操作數組元素改變原始數組本身,因為對象是個引用數據類型嘛!
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
var sum =0;
data.forEach(value=>{
  sum+=value;
})
log(sum);

data.forEach((v,i,a)=>{
  a[i]=v+1;
})
log(data);

var data_post=[{a:1},{a:2}]
data_post.forEach(value=>{
  value.a++;
})
log(data_post)

map() —>映射

  • 使用熱度:經常用
  • 是否改變原始數組:否
  • 返回:返回一個新函數
  • 參數:
參數位置 參數類型 是否必選 說明
1 function 三個參數分別是:數組元素、元素的索引、數組本身
  • 說明:傳遞給map函數應該有返回值,返回值是新數組的元素。
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.map(x=>{
  return x*x;
})
log(b)

filter() —>過濾

  • 使用熱度:常用
  • 是否改變原始數組:否
  • 返回:返回過濾后的數組
  • 參數:
參數位置 參數類型 是否必選 說明
1 function 三個參數分別是:數組元素、元素的索引、數組本身
  • 說明:如果返回值是true或者可以轉化為true的值,那麼這個值就是新數組的元素。
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.filter(x=>{
  return x<3;
})
log(b)

every() —>檢測

  • 使用熱度:不常用
  • 是否改變原始數組:否
  • 返回:true或者false
  • 參數:
參數位置 參數類型 是否必選 說明
1 function 三個參數分別是:數組元素、元素的索引、數組本身
  • 說明:當且僅當針對數組中的所有元素調用綁定函數都返回true時,它才返回true。
  • 注意:一旦every或者some已經確定了改返回什麼值得時候就不會遍曆數組了。根據數學上的慣例,在空數組調用時,every返回true,some返回false。
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.every(x=>{
  return x<10;
})
log(b)

var c= data.every(x=>{
  return x%2===0;
})
log(c)

some() —>檢測

  • 使用熱度:不常用
  • 是否改變原始數組:否
  • 返回:true或者false
  • 參數:
參數位置 參數類型 是否必選 說明
1 function 三個參數分別是:數組元素、元素的索引、數組本身
  • 說明:當數組中至少有一個元素調用綁定函數返回true時,它就返回true。
  • 注意:一旦every或者some已經確定了改返回什麼值得時候就不會遍曆數組了。根據數學上的慣例,在空數組調用時,every返回true,some返回false。
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.some(x=>{
  return x>10;
})
log(b)

var c= data.some(x=>{
  return x%2===0;
})
log(c)

reduce() —>簡化

  • 使用熱度:不常用
  • 是否改變原始數組:否
  • 返回:返回一個值
  • 參數:
參數位置 參數類型 是否必選 作用
1 function 四個參數分別是:初始化值/數組元素、數組元素、元素的索引、數組本身
2 number 供計算的初始化值
  • 說明:第一個參數是到目前為止的簡化操作累計的結果
  • 注意:如果沒有初始化值,第一次調用函數的第一個參數就是第一個數組元素,第二個參數則是第二個數組元素。如果有初始化值,第一次調用函數的第一個參數就是初始化值,二個參數則是第一個數組元素。
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b= data.reduce((x,y)=>{
  return x+y;
},0)
log(b)

var c= data.reduce((x,y)=>{
  return x*y;
},1)
log(c)

var d= data.reduce((x,y)=>{
  return x>y?x:y;
},1)
log(d)

reduceRight() —>簡化

  • 使用熱度:不常用
  • 是否改變原始數組:否
  • 返回:返回一個值
  • 參數:
參數位置 參數類型 是否必選 作用
1 function 四個參數分別是:初始化值/數組元素、數組元素、元素的索引、數組本身
2 number 供計算的初始化值
  • 說明:第一個參數是到目前為止的簡化操作累計的結果。不同於reduce這個僅僅是從右到左計算。
  • 注意:如果沒有初始化值,第一次調用函數的第一個參數就是第一個數組元素,第二個參數則是第二個數組元素。如果有初始化值,第一次調用函數的第一個參數就是初始化值,二個參數則是第一個數組元素。
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
data.reduceRight((x,y)=>{
  log(y)
  return x+y;
},0)

indexOf() —>搜索

  • 使用熱度:經常用
  • 是否改變原始數組:否
  • 返回:返回數組索引或者-1
  • 參數:
參數位置 參數類型 是否必選 作用
1 * 要搜索的數組元素
2 number 從數組哪個索引開始搜索
  • 說明:如果能搜索到結果將返回第一個索引,如果搜索不到就返回-1
  • 注意:如果第二個參數是負數,指的是從數組元素末尾的偏移量位置開始向後搜索,而不是到偏移量位置就截止搜索了,這裡是很容易和splice弄混的。
  • 實例如下:
var log=console.log;
var data=[1,2,3,4,5];
var b=data.indexOf(1,-5);
log(b);

lastIndexOf() —>搜索

  • 使用熱度:經常用
  • 是否改變原始數組:否
  • 返回:返回數組索引或者-1
  • 參數:
參數位置 參數類型 是否必選 作用
1 * 要搜索的數組元素
2 number 從數組哪個索引開始搜索
  • 說明:和indexOf不同的是lashIndexOf是反向搜索
  • 注意:因為是反向搜索,當第二個參數是負數的時候,就是指從末尾偏移量的位置向前搜索
  • 實例如下:
var log=console.log;
var data=[1,2,3,2,5];
var b=data.lastIndexOf(2,-3)
log(b)

var c=data.lastIndexOf(1,-5)
log(c)

本站聲明:網站內容來源於博客園,如有侵權,請聯繫我們,我們將及時處理

【其他文章推薦】

※為什麼 USB CONNECTOR 是電子產業重要的元件?

網頁設計一頭霧水??該從何著手呢? 找到專業技術的網頁設計公司,幫您輕鬆架站!

※想要讓你的商品成為最夯、最多人討論的話題?網頁設計公司讓你強力曝光

※想知道最厲害的台北網頁設計公司推薦台中網頁設計公司推薦專業設計師”嚨底家”!!