JavaScript 常用的高階函數

前言:

  • 高階函數(Higher-Order Function)就是操作其他函數的函數


一、map()

按照同一規則 改變數組內的每個值

	function pow(x) {
    	return x * x;
	}
	var arr = [1, 2, 3, 4];
	var results = arr.map(pow); // [1, 4, 9, 16]
	results = results.map(String); // ['1', '4', '9', '16',]

二、reduce()

對數組中的每個元素執行一個由您提供的reducer函數(升序執行)
將其結果彙總爲單個返回值

	var arr = [1, 3, 5, 7, 9];
	var sum = arr.reduce(function (x, y) {
    	return x + y;
	}); // 25
	var integer = arr.reduce(function (x, y) {
    	return x * 10 + y;
	}); // 13579

三、filter()

過濾掉數組中的某些元素,然後返回剩下的元素
返回值是true還是false決定了保留還是丟棄該元素

	var arr = [1, 2, 4, 5, 6, 9, 10, 15];
	var r = arr.filter(function (x) {
    	return x % 2 !== 0;
	}); // [1, 5, 9 ,15]
	
	// 回調函數
	var arr = ['A', 'B', 'C'];
	var r = arr.filter(function (element, index, self) {
    	console.log(element); // 依次打印 Value 值 'A', 'B', 'C'
	    console.log(index); // 依此打印 Key 值 0, 1, 2
    	console.log(self); // self 就是變量 arr
	    return true;
	});
	
	// 用回調函數去掉 Array 重複元素, indexOf 總是返回第一個元素的位置
	var m,
    	arr = ['apple', 'strawberry', 'banana', 'pear', 'apple'];
	m = arr.filter(function (element, index, self) {
    	return self.indexOf(element) === index;
	}); // ['apple', 'strawberry', 'banana', 'pear'];

四、sort()

該函數用來排序

	['Google', 'Apple', 'Microsoft'].sort(); 
	// ['Apple', 'Google', 'Microsoft']
	
	// 字符串根據ASCII碼進行排序
	// 而小寫a的ASCII碼在大寫字幕之後
	['Google', 'apple', 'Microsoft'].sort(); 
	// ['Google', 'Microsoft', 'apple']
	
	// sort() 方法默認把所有元素先轉換爲String再排序
	// 結果 '10' 排在了 '2' 的前面
	// 因爲字符 '1' 比字符 '2' 的 ASCII 碼小
	[10, 20, 1, 2].sort(); // [1, 10, 2, 20]
	// sort() 還可以接收一個比較函數來實現自定義的排序
	// 數字大小排序
	var arr = [10, 20, 1, 2];
	arr.sort(function (x, y) {
    	if (x < y)
	        return -1;
	    if (x > y)
	        return 1;
	    return 0;
	}); // arr的值變爲 [1, 2, 10, 20]
	// 字符串排序
	var arr = ['Google', 'apple', 'Microsoft'];
	arr.sort(function (s1, s2) {
	    var x1 = s1.toUpperCase();
	    var x2 = s2.toUpperCase();
	    if (x1 < x2)
	        return -1;
	    if (x1 > x2)
	        return 1;
	    return 0;
	}); // ['apple', 'Google', 'Microsoft'];
	// 數組比較
	var a1 = ['B', 'A', 'C'];
	var a2 = al.sort();
	a1; // ['A', 'B', 'C']
	a2; // ['A', 'B', 'C']
	a1 === a2; // true, a1 和 a2 是同一個對象


參考文檔

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章