溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

ecmascript 5中數(shù)組的map()方法怎么用

發(fā)布時(shí)間:2021-12-07 14:36:08 來(lái)源:億速云 閱讀:121 作者:小新 欄目:web開發(fā)

這篇文章將為大家詳細(xì)講解有關(guān)ecmascript 5中數(shù)組的map()方法怎么用,小編覺得挺實(shí)用的,因此分享給大家做個(gè)參考,希望大家閱讀完這篇文章后可以有所收獲。

在ecmascript中,map()方法可以對(duì)數(shù)組的每個(gè)元素調(diào)用指定的回調(diào)函數(shù)進(jìn)行處理,并返回包含結(jié)果的數(shù)組;語(yǔ)法“array.map(function(currentValue,index,arr), thisValue)”。

本教程操作環(huán)境:windows7系統(tǒng)、javascript1.8.5版、Dell G3電腦。

map()方法可以對(duì)數(shù)組的每個(gè)元素調(diào)用指定的回調(diào)函數(shù)進(jìn)行處理,并返回包含結(jié)果的數(shù)組。

map() 方法按照原始數(shù)組元素順序依次處理元素。

語(yǔ)法

array.map(function(currentValue,index,arr), thisValue)
參數(shù)描述
function(currentValue, index,arr)

必須。函數(shù),數(shù)組中的每個(gè)元素都會(huì)執(zhí)行這個(gè)函數(shù)。

函數(shù)參數(shù):

  • currentValue 必須。當(dāng)前元素的值

  • index 可選。當(dāng)前元素的索引值

  • arr 可選。當(dāng)前元素屬于的數(shù)組對(duì)象

thisValue可選。對(duì)象作為該執(zhí)行回調(diào)時(shí)使用,傳遞給函數(shù),用作 "this" 的值。
如果省略了 thisValue,或者傳入 null、undefined,那么回調(diào)函數(shù)的 this 為全局對(duì)象。

map() 方法將返回一個(gè)新數(shù)組,其中每個(gè)元素均為關(guān)聯(lián)的原始數(shù)組元素的回調(diào)函數(shù)返回值。對(duì)于數(shù)組中的每個(gè)元素,map() 方法都會(huì)調(diào)用 callbackfn 函數(shù)一次(采用升序索引順序),并不會(huì)為數(shù)組中缺少的元素調(diào)用回調(diào)函數(shù)。

除了數(shù)組對(duì)象之外,map() 方法可由具有 length 屬性,且具有已按編制索引的屬性名的任何對(duì)象使用,如 Arguments 參數(shù)對(duì)象。

map() 方法不直接修改原始數(shù)組,但回調(diào)函數(shù)可能會(huì)修改它。在 map 方法啟動(dòng)后修改數(shù)組對(duì)象所獲得的結(jié)果說明如表所示。

回調(diào)函數(shù)修改數(shù)組的影響
map 方法啟動(dòng)后的條件元素是否傳遞給回調(diào)函數(shù)
在數(shù)組的原始長(zhǎng)度之外添加元素
添加元素以填充數(shù)組中缺少的元素是,如果該索引尚未傳遞給回調(diào)函數(shù)
元素已更改是,如果該元素尚未傳遞給回調(diào)函數(shù)
從數(shù)組中刪除元素否,除非該元素已傳遞給回調(diào)函數(shù)

示例1

下面示例使用 map() 方法映射數(shù)組,把數(shù)組中每個(gè)元素的值平方,乘以 PI 值,把返回的圓的面積值作為新數(shù)組的元素值,最后返回這個(gè)新數(shù)組。

function f (radius) {
    var area = Math.PI * (radius * radius);
    return area.toFixed(0);
}
var a = [10,20,30];
var a1 = a.map(f);
console.log(a1);

ecmascript 5中數(shù)組的map()方法怎么用

示例2

下面示例使用 map() 方法映射數(shù)組,把數(shù)組中每個(gè)元素的值除以一個(gè)閾值,然后返回這個(gè)新數(shù)組其中回調(diào)函數(shù)和閾值都以對(duì)象的屬性存在,通過這種方法演示如何在 map 中使用 thisArg 參數(shù)。

var obj = {
    val : 10,
    f : function (value) {
        return value % this.val;
    }
}
var a = [6,12,25,30];
var a1 = a.map(obj.f, obj);
console.log(a1);  //6,2,5,0

ecmascript 5中數(shù)組的map()方法怎么用

示例3

下面示例演示如何使用 JavaScript 內(nèi)置方法作為回調(diào)函數(shù)。

var a = [9, 16];
var a1 = a.map(Math.sqrt);
console.log(a1);  //3,4

ecmascript 5中數(shù)組的map()方法怎么用

示例4

下面示例演示如何使用 map 方法應(yīng)用于一個(gè)類數(shù)組。在示例中通過動(dòng)態(tài)調(diào)用的方法(Call)把 map 作用于一個(gè)字符串上,則 map 將遍歷字符串中每個(gè)字符,并調(diào)用回調(diào)函數(shù) threeChars,把每個(gè)字符左右 3 個(gè)字符截取出來(lái),映射到一個(gè)新數(shù)組中。

function f (value, index, str) {
    return str.substring(index - 1, index + 2);
}
var s = "Thursday";
var a = [].map.call(s, f);
console.log(a);  //Th,Thu,hur,urs,rsd,sda,day,ay

ecmascript 5中數(shù)組的map()方法怎么用

關(guān)于“ecmascript 5中數(shù)組的map()方法怎么用”這篇文章就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,使各位可以學(xué)到更多知識(shí),如果覺得文章不錯(cuò),請(qǐng)把它分享出去讓更多的人看到。

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI