2014-10-10 00:00

[API-d14] - [Javascript 番外篇] Javascript function scopes 和 closures

這幾天會探討 javascript 的特性,由於比較少在寫 js ,因此有錯請指正

##Scope

例子:

function hi() {
    var greetings = "hi";

    console.log("Say: " + greetings);

    function sayYa(newInput) {
        greetings = newInput;
        console.log("Say: " + greetings);
    }

    function sayCool(newInput) {
        var cool = newInput;
        console.log("Say: " + cool);
    }

    sayYa("Yo");
    sayCool("Cool");

    console.log("Say: " + greetings);
}

hi();

很簡單的概念

greetins 在 sayYa 方法中被覆寫掉了

如果要定義 local 變數必須在 function 裏用 var 定義

例如 sayCool function

##Closure

例子:

function person(){
    var name = 'default';

    return {
        greetings: function() {
            console.log( name );
        },
        changeName: function(newInput) {
            name = newInput;
        }
    };
}

var me = new person();
me.greetings();
me.changeName("kerkerj");
me.greetings();

##Self-Executing Anonymous Functions

使用這種方式通常是避免和其他 js 檔案造成變數混淆

或是初始化

裡面的變數和 function 只被限制在這個範圍內

例子:

(function(){
    var hi = 'Hello';

    function sayHi(name){
        return hi + ' ' + name;
    }

    global.greetings = sayHi
})(global);

console.log(global.greetings("kerkerj"));
console.log(hi); // <- 這會失敗

必須將 sayHi 指給 global 的某一個變數, 才有辦法使用它

在 node.js 中 global 是全域變數,在瀏覽器中是 window~

Share

comments powered by Disqus