DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> JavaScript中的閉包介紹
JavaScript中的閉包介紹
編輯:關於JavaScript     

所謂的閉包應該是指: 內部函數讀取當前函數以外的變量,即創建時所處的上下文環境。
復制代碼 代碼如下:
function hello(){
    var char = "hello,world";
    function print(){
        console.log(char);
    };
    return print();
}

需要注意的是這裡的print函數引用了外部hello函數的char變量,於是在這裡我們能夠返回一個
復制代碼 代碼如下:
hello,world

而這個功能在某種意義上來說,應該是要歸功於作用域。當然了,我們沒有辦法直接訪問char,除非是我們聲明這個變量的時候出錯了。如
復制代碼 代碼如下:
function hello(){
    char = "hello,world";
    function print(){
        console.log(char);
    };
    return print();
}

僅僅是因為少了個var。

復制代碼 代碼如下:
在這裡hello變成一個閉包 了。 閉包是一種特殊的對象。它由兩部分構成:函數,以及創建該函數的環境。環境由閉包創建時在作用域中的任何局部變量組成。

Javscript 閉包與this

需要注意的是讀取this與arguments時,可能是會出問題的。
復制代碼 代碼如下:
function hello(){
    this.char = "hello,world";
    function output(){
        char = "I'm no hello world";      
        console.log(this.char);
    };
    return output();
}

當然了這個例子並不夠貼切,so,我們需要一個額外的例子來解釋這個問題,下面引用一個《Javascript高級程序設計》中的一個例子,來說明這個問題。
復制代碼 代碼如下:
var name = "The window";

var object = {
    name: "My Object",

    getNameFunc: function(){
        return function(){
            return this.name;
        }
    }
};
object.getNameFunc()()

只是這種用法實在是,而解決方法便是保存一個臨時變量that,如之前在《關於Javascript的this的一些知識》一文中所說的。

復制代碼 代碼如下:
var name = "The window";
var object = {
    name: "My Object",

    getNameFunc: function(){
        var that = this;
        return function(){
            return that.name;
        }
    }
};
object.getNameFunc()()

Javscript 閉包與讀寫變量
值得注意的是,如果我們沒有處理好我們的變量時,我們也可以修改這些變量。
復制代碼 代碼如下:
function hello(){
    var char = "hello,world";
    return{
        set: function(string){
            return char = string;
        },
        print: function(){
            console.log(char)
        }
    }
}
var say = hello();
say.set('new hello,world')
say.print() // new hello world

Javascript 閉包與性能

引用MDC的說法
復制代碼 代碼如下:
 如果不是因為某些特殊任務而需要閉包,在沒有必要的情況下,在其它函數中創建函數是不明智的,因為閉包對腳本性能具有負面影響,包括處理速度和內存消耗。

文上還說到。
復制代碼 代碼如下:
 例如,在創建新的對象或者類時,方法通常應該關聯於對象的原型,而不是定義到對象的構造器中。原因是這將導致每次構造器被調用,方法都會被重新賦值一次(也就是說,為每一個對象的創建)。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved