juery學習之map和each?

map和each在juery是非常常用的屬性方法，非常有用，需要牢牢掌握，今天為大家演示一個小例子，幫助大家掌握理解。

工具/原料

windows作業系統

vs個版本開發工具，網頁編輯器

方法/步驟

開啟textpad或者其他網頁編輯器，新建一個文件，如下圖所示

編輯好最基本的html的頭，body，js等，如圖所示：

這個是關鍵步驟引入js的引用框架。如紅色標示

引入方法myMap，具體如下

var arr = [100, 200, 300, 400];

// arr = $.map(arr, function (item) {

// return item + 2;

// });

// alert(arr);

//模擬map的內部實現

function myMap(arr, fn) {

//定義一個空陣列，和一個value變數

var ret = [], value;

for (var i = 0, length = arr.length; i < length; i++) {

//呼叫fn對陣列中的每個元素處理 並返回

value = fn(arr[i], i);

if (value != null) {

ret[ret.length] = value;

}

}

return ret;

}

測試另一個方法，

}

//演示匿名函式中的第二個引數的用法

// arr = myMap(arr, function (item ,i) {

// return item + i;

// });

//alert(arr);

//$.each

//對字典遍歷

var dic = { "name": "zs", "age": 18, "sex": "男" };

// $.each(dic, function (key, value) {

// alert(key + ":"+value);

// });

// $.each(dic, function (key) {

// alert(key + "+" + dic[key]);

// })

// $.each(dic, function () {

// //在each的 第二個引數中 this是字典的值 callback.call()

// //alert(this);

// })

//陣列遍歷

// $.each(arr, function (key, value) {

// alert(key + "+" + value);

// })

// $.each(arr, function () {

// alert(this);

// })

執行輸出如下圖所示結果。

注意事項

學習程式開發一定要活學活用，不然是沒有效果的