基礎的JavaScript函數

標籤：第一個   重複   gpo   去除   依次   blog   lock   map   怎麼辦   

基礎的JavaScript函數

• 1.首字母大寫
• 2.去除數組重複項
• 3.數組的排序
• 4.閉包

1. 把使用者輸入的不規範的英文名字，變為首字母大寫，其他小寫規範名字(使用JavaScript的map函數)

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;});

function normalize(arr) {    return arr.map(function(item,index){    item=item.slice(0, 1).toUpperCase()+item.slice(1).toLowerCase();    return item;    })}normalize([‘adam‘, ‘LISA‘, ‘barT‘]);

2. filter()接收的回呼函數，其實可以有多個參數。通常我們僅使用第一個參數，表示Array的某個元素。回呼函數還可以接收另外兩個參數，表示元素的位置和數組本身

var r;var arr = [‘apple‘, ‘strawberry‘, ‘banana‘, ‘pear‘, ‘apple‘, ‘orange‘, ‘orange‘, ‘strawberry‘];r = arr.filter(function (element, index, self) {    return self.indexOf(element) === index;});

3. sort()數組的排序

//這是排正序var arr = [10, 20, 1, 2];arr.sort(function (x, y) {    if (x < y) {        return -1;    }    if (x > y) {        return 1;    }    return 0;});console.log(arr); // [1, 2, 10, 20]//這是排倒序arr.sort(function (x, y) {    if (x < y) {        return 1;    }    if (x > y) {        return -1;    }    return 0;});

4. 閉包

當一個函數返回了一個函數後，其內部的局部變數還被新函數引用。
返回的函數並沒有立即執行，而是直到f()才執行。

function count() {    var arr = [];    for (var i=1; i<=3; i++) {        arr.push(function () {            return i * i;        });    }    return arr;}var results = count();var f1 = results[0];var f2 = results[1];var f3 = results[2];

在上面的例子中，每次迴圈，都建立一個新的函數，然後把建立的三個函數都添加到了一個Array中返回。
你可能認為調用f1()，f2()和f3()結果應該是1，4，9，但實際結果是：

f1(); // 16f2(); // 16f3(); // 16

全部都是16！原因就在於返回的函數引用了變數i，但它並非立刻執行。等到3個函數都返回時，它們所引用的變數i已經變成了4，因此最終結果為16。

返回閉包時牢記的一點就是：返回函數不要引用任何迴圈變數，或者後續會發生變化的變數。

如果一定要引用迴圈變數怎麼辦？方法是再建立一個函數，用該函數的參數綁定迴圈變數當前的值，無論該迴圈變數後續如何更改，已綁定到函數參數的值不變：

function count() {    var arr = [];    for (var i=1; i<=3; i++) {        arr.push((function (n) {            return function () {                return n * n;            }        })(i));    }    return arr;}var results = count();var f1 = results[0];var f2 = results[1];var f3 = results[2];f1(); // 1f2(); // 4f3(); // 9

基礎的JavaScript函數