Javascript類中的實例變量

我主要使用PHP和Java編寫代碼，但我偶爾會在項目的前端工作並使用JavaScript。我通常創建對象不同於下面，但我遇到了這一點，它引起了我的興趣，因爲它的語法與我通常編程的類似。Javascript類中的實例變量

我正在四處尋找，試圖弄清楚如何使用實例變量JavaScript類使用下面的語法。我試過用name;或_name;或var name;或所有這些以前的變量聲明實例變量，並添加= null;，但仍然在我的控制檯中出現錯誤。錯誤主要是my-file.js:2 Uncaught SyntaxError: Unexpected identifier。我只是想通過我的構造函數設置我的實例變量。

如何在JavaScript中使用實例變量，使用下面的語法？

class MyClass { 
    var _name; 

    constructor(name) { 
    _name = name; 
    alert("Hello world, from OO JS!"); 
    this.myFunction(); 
    } 

    myFunction() { 
    document.getElementById("myElement").addEventListener("click", function() { 
     console.log("Ant's function runs. Hello!"); 
    }); 
    } 
} 

window.onload = function() { 
    var person = "John Smith"; 
    var myClass = new MyClass(person); 
}

來源

2016-11-17 aCarella

使用'this'關鍵字：'this._name = name;' –

您不聲明屬性;只需設置'this._name = name;'。 – Ryan

@Ryan我如何在我的事件監聽器中訪問實例變量？ 'this._name'只產生'undefined'。 – aCarella

這仍然是一個proposal，它看起來如下：

class A { 
    property = "value"; 
}

順便說一句，當你要訪問類屬性（即自己的對象屬性），你仍然需要使用this.property：

class A { 
    property = "value"; 

    constructor() { 
     console.log(this.property); 
    } 
}

如果你今天想用這個語法，你需要使用一個transpiler像Babel。

來源

2016-11-17 15:00:14

您不聲明屬性;只需設置this._name = name。

@Ryan我怎麼才能在我的事件監聽器中訪問實例變量？ this._name僅產生undefined。

每個函數調用*都有自己的this;你的事件監聽器是一個函數。您可以將事件偵聽器和訪問that以外分配var that = this;裏面：

myFunction() { 
    var that = this; 

    document.getElementById("myElement").addEventListener("click", function() { 
    console.log(that._name); 
    }); 
}

或創建一個新的功能，它始終與使用Function.prototype.bind相同this要求你：

myFunction() { 
    document.getElementById("myElement").addEventListener("click", function() { 
    console.log(this._name); 
    }.bind(this)); 
}

或者使用ES6的箭頭的功能，它們使用定義它們的值this（詞彙this）：

myFunction() { 
    document.getElementById("myElement").addEventListener("click",() => { 
    console.log(this._name); 
    }); 
}

來源

2016-11-17 16:07:36 Ryan

超級有用。感謝您的解釋。 – aCarella

Javascript類中的實例變量

回答

相關問題