摘要:例如,在一個中,刪掉偶數,只保留奇數,可以這么寫把一個中的空字符串刪掉,可以這么寫注意以下的版本沒有方法可見用這個高階函數,關鍵在于正確實現一個篩選函數。回調函數接收的回調函數,其實可以有多個參數。
1.map
由于map()方法定義在JavaScript的Array中,我們調用Array的map()方法,傳入我們自己的函數,就得到了一個新的Array作為結果:
function pow(x) { return x * x; } var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; arr.map(pow); // [1, 4, 9, 16, 25, 36, 49, 64, 81]
map()傳入的參數是pow,即函數對象本身。
你可能會想,不需要map(),寫一個循環,也可以計算出結果
map()作為高階函數,事實上它把運算規則抽象了,因此,我們不但可以計算簡單的f(x)=x2,還可以計算任意復雜的函數,比如,把Array的所有數字轉為字符串:
var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9]; arr.map(String); // ["1", "2", "3", "4", "5", "6", "7", "8", "9"]
只需要一行代碼。
2.reduce再看reduce的用法。Array的reduce()把一個函數作用在這個Array的[x1, x2, x3...]上,這個函數必須接收兩個參數,reduce()把結果繼續和序列的下一個元素做累積計算,其效果就是:
[x1, x2, x3, x4].reduce(f) = f(f(f(x1, x2), x3), x4)
比方說對一個Array求和,就可以用reduce實現:
var arr = [1, 3, 5, 7, 9]; arr.reduce(function (x, y) { return x + y; }); // 25
要把[1, 3, 5, 7, 9]變換成整數13579,reduce()也能派上用場:
var arr = [1, 3, 5, 7, 9]; arr.reduce(function (x, y) { return x * 10 + y; }); // 135793.filter
filter也是一個常用的操作,它用于把Array的某些元素過濾掉,然后返回剩下的元素。
和map()類似,Array的filter()也接收一個函數。和map()不同的是,filter()把傳入的函數依次作用于每個元素,然后根據返回值是true還是false決定保留還是丟棄該元素。
例如,在一個Array中,刪掉偶數,只保留奇數,可以這么寫:
var arr = [1, 2, 4, 5, 6, 9, 10, 15]; var r = arr.filter(function (x) { return x % 2 !== 0; }); r; // [1, 5, 9, 15]
把一個Array中的空字符串刪掉,可以這么寫:
var arr = ["A", "", "B", null, undefined, "C", " "]; var r = arr.filter(function (s) { return s && s.trim(); // 注意:IE9以下的版本沒有trim()方法 }); r; // ["A", "B", "C"]
可見用filter()這個高階函數,關鍵在于正確實現一個“篩選”函數。
3.1回調函數
filter()接收的回調函數,其實可以有多個參數。通常我們僅使用第一個參數,表示Array的某個元素?;卣{函數還可以接收另外兩個參數,表示元素的位置和數組本身:
var arr = ["A", "B", "C"];
var r = arr.filter(function (element, index, self) {
console.log(element); // 依次打印"A", "B", "C" console.log(index); // 依次打印0, 1, 2 console.log(self); // self就是變量arr return true;
});
利用filter,可以巧妙地去除Array的重復元素:
"use strict"; var r, arr = ["apple", "strawberry", "banana", "pear", "apple", "orange", "orange", "strawberry"]; r = arr.filter(function (element, index, self) { return self.indexOf(element) === index; });
去除重復元素依靠的是indexOf總是返回第一個元素的位置,后續的重復元素位置與indexOf返回的位置不相等,因此被filter濾掉了。
4.sortJavaScript的Array的sort()方法就是用于排序的,但是排序結果可能讓你大吃一驚:
// 看上去正常的結果: ["Google", "Apple", "Microsoft"].sort(); // ["Apple", "Google", "Microsoft"]; // apple排在了最后: ["Google", "apple", "Microsoft"].sort(); // ["Google", "Microsoft", "apple"] // 無法理解的結果: [10, 20, 1, 2].sort(); // [1, 10, 2, 20]
第二個排序把apple排在了最后,是因為字符串根據ASCII碼進行排序,而小寫字母a的ASCII碼在大寫字母之后。
第三個排序結果是什么鬼?簡單的數字排序都能錯?
這是因為Array的sort()方法默認把所有元素先轉換為String再排序,結果"10"排在了"2"的前面,因為字符"1"比字符"2"的ASCII碼小。
要按數字大小排序,我們可以這么寫:
var arr = [10, 20, 1, 2]; arr.sort(function (x, y) { if (x < y) { return -1; } if (x > y) { return 1; } return 0; }); // [1, 2, 10, 20]
如果要倒序排序,我們可以把大的數放前面:
var arr = [10, 20, 1, 2]; arr.sort(function (x, y) { if (x < y) { return 1; } if (x > y) { return -1; } return 0; }); // [20, 10, 2, 1]
默認情況下,對字符串排序,是按照ASCII的大小比較的,現在,我們提出排序應該忽略大小寫,按照字母序排序。要實現這個算法,不必對現有代碼大加改動,只要我們能定義出忽略大小寫的比較算法就可以:
var arr = ["Google", "apple", "Microsoft"]; arr.sort(function (s1, s2) { x1 = s1.toUpperCase(); x2 = s2.toUpperCase(); if (x1 < x2) { return -1; } if (x1 > x2) { return 1; } return 0; }); // ["apple", "Google", "Microsoft"]
最后友情提示,sort()方法會直接對Array進行修改,它返回的結果仍是當前Array:
var a1 = ["B", "A", "C"]; var a2 = a1.sort(); a1; // ["A", "B", "C"] a2; // ["A", "B", "C"] a1 === a2; // true, a1和a2是同一對象
文章版權歸作者所有,未經允許請勿轉載,若此文章存在違規行為,您可以聯系管理員刪除。
轉載請注明本文地址:http://specialneedsforspecialkids.com/yun/86870.html
JSON JSON是JavaScript Object Notation的縮寫,它是一種數據交換格式。 道格拉斯·克羅克福特(Douglas Crockford)--雅虎的高級架構師--發明了JSON這種超輕量級的數據交換格式. 序列化 讓我們先把小明這個對象序列化成JSON格式的字符串: var xiaoming = { name: 小明, age: 14, gender...
摘要:對象不但充當全局作用域,而且表示瀏覽器窗口。對象有和屬性,可以獲取瀏覽器窗口的內部寬度和高度。對象表示當前頁面的信息。由于在瀏覽器中以形式表示為樹形結構,對象就是整個樹的根節點。這個行為由瀏覽器實現,主流瀏覽器均支持選項,從開始支持。 瀏覽器 目前主流的瀏覽器: IE 6~11:從IE10開始支持ES6標準; Chrome:基于Webkit內核,內置了非常強悍的JavaScript引...
摘要:你可能認為調用,和結果應該是,,,但實際結果是全部都是原因就在于返回的函數引用了變量,但它并非立刻執行。返回閉包時牢記的一點就是返回函數不要引用任何循環變量,或者后續會發生變化的變量。真的是看著很暈那 閉包 另一個需要注意的問題是,返回的函數并沒有立刻執行,而是直到調用了f()才執行。我們來看一個例子: function count() { var arr = []; ...
摘要:用操作表單和操作是類似的,因為表單本身也是樹。因此,第二種方式是響應本身的事件,在提交時作修改可以在此修改的繼續下一步注意要來告訴瀏覽器繼續提交,如果,瀏覽器將不會繼續提交,這種情況通常對應用戶輸入有誤,提示用戶錯誤信息后終止提交。 用JavaScript操作表單和操作DOM是類似的,因為表單本身也是DOM樹。 HTML表單的輸入控件主要有以下幾種: 文本框,對應的,用于輸入文本; ...
摘要:讓我們拆開寫小明正常結果單獨調用函數怎么返回了請注意,我們已經進入到了的一個大坑里。如果單獨調用函數,比如,此時,該函數的指向全局對象,也就是。 函數 1. arguments JavaScript還有一個免費贈送的關鍵字arguments,它只在函數內部起作用,并且永遠指向當前函數的調用者傳入的所有參數。arguments類似Array但它不是一個Array: function fo...
摘要:在設計時,有兩種比較運算符第一種是比較,它會自動轉換數據類型再比較,很多時候,會得到非常詭異的結果第二種是比較,它不會自動轉換數據類型,如果數據類型不一致,返回,如果一致,再比較。 數據類型和變量 數據類型計算機顧名思義就是可以做數學計算的機器,因此,計算機程序理所當然地可以處理各種數值。但是,計算機能處理的遠不止數值,還可以處理文本、圖形、音頻、視頻、網頁等各種各樣的數據,不同的數據...
閱讀 2270·2019-08-30 15:56
閱讀 3108·2019-08-30 13:48
閱讀 1123·2019-08-30 10:52
閱讀 1490·2019-08-29 17:30
閱讀 417·2019-08-29 13:44
閱讀 3528·2019-08-29 12:53
閱讀 1113·2019-08-29 11:05
閱讀 2667·2019-08-26 13:24