亚洲乱码中文字幕综合,中国熟女仑乱hd,亚洲精品乱拍国产一区二区三区,一本大道卡一卡二卡三乱码全集资源,又粗又黄又硬又爽的免费视频

JavaScript中forEach和map方法的使用與區(qū)別

 更新時間:2023年02月06日 16:21:50   作者:蘇涼.py  
眾所周知map和forEach是數(shù)組的操作方法,下面這篇文章主要給大家介紹了關(guān)于JavaScript中forEach和map方法的使用與區(qū)別,文中通過實例代碼介紹的非常詳細(xì),需要的朋友可以參考下

前言

上節(jié)我們說到遍歷數(shù)組的方法,使用for循環(huán)進(jìn)行遍歷,其實在js中還有另外兩種方法可以將我們的數(shù)組更快的遍歷出來,那就是forEach方法和map方法。下面我們一起看看如何使用吧。

forEach方法

forEach()方法需要一個函數(shù)作為參數(shù)

  • 像這種函數(shù),由我們創(chuàng)建但是不由我們調(diào)用的被稱為回調(diào)函數(shù)
  • 數(shù)組中有幾個元素,函數(shù)就會執(zhí)行幾次,每次執(zhí)行時,瀏覽器會將遍歷到的元素以實參的形式傳遞進(jìn)來,我們可以來定義形參來讀取這些內(nèi)容。
  • 瀏覽器會在回調(diào)函數(shù)中傳遞三個參數(shù):

第一個參數(shù) - 當(dāng)前正在遍歷的元素

第二個參數(shù) - 當(dāng)前正在遍歷的元素的索引

第三個參數(shù) - 正在遍歷的數(shù)組

map方法

同樣的map方法和forEach方法一樣,需要用到一個函數(shù)作為參數(shù)。該函數(shù)作為回調(diào)函數(shù),同樣該回調(diào)函數(shù)中傳遞三個參數(shù)。

第一個參數(shù) - 當(dāng)前正在遍歷的元素

第二個參數(shù) - 當(dāng)前正在遍歷的元素的索引

第三個參數(shù) - 正在遍歷的數(shù)組

map和forEach方法的區(qū)別

以下截圖來自??途W(wǎng)!

請?zhí)砑訄D片描述

從上圖來看,map方法會返回一個新的數(shù)組,而forEach方法不會,如圖所示。

補充:二者的應(yīng)用場景

forEach可用于單選多選框的綁定

let arr = [ 
      { name:'商品1', select:false }, 
      { name:'商品2', select:true }, 
      { name:'商品3', select:false }, 
      { name:'商品4', select:false }, 
    ]
 
 // 需求: 全選(設(shè)置每一個元素的select值為true)
    arr.forEach( (item,index) => {
      item.select = true
    } )
    console.log( arr )

map可用于對數(shù)組的批量操作

let arr = [ 20,50,88,60,56 ]
 
// 箭頭函數(shù)的函數(shù)體只有一行,則可以省略大括號。 此時也必須要省略return
    const res =  arr.map( item => item*0.5 )
    console.log(res)

總結(jié)

到此這篇關(guān)于JavaScript中forEach和map方法的使用與區(qū)別的文章就介紹到這了,更多相關(guān)js中forEach和map方法內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評論