最新消息:雨落星辰是一个专注网站SEO优化、网站SEO诊断、搜索引擎研究、网络营销推广、网站策划运营及站长类的自媒体原创博客

javascript - ES7 Classes: Declaring Properties Outside of Constructor - Stack Overflow

programmeradmin6浏览0评论

Is there any difference between declaring variables inside the constructor vs. outside?

For functions, 'this' is bound differently, but for variables, I cannot figure out if there is a difference.

class Widget {
    constructor(constructorName) {
    this.constructorName = constructorName;
  }
  nonConstructorName = "nonConstructorName1";
}



var myWidget = new Widget("myConstructorName1");

console.log(myWidget.constructorName); // "myConstructorName1"
console.log(myWidget.nonConstructorName); // "nonConstructorName1"

myWidget.constructorName = "myConstructorName2";
myWidget.nonConstructorName = "nonConstructorName2";

console.log(myWidget.constructorName); // "myConstructorName2"
console.log(myWidget.nonConstructorName); // "nonConstructorName2"

console.log(myWidget.prototype.constructorName); // "undefined"
console.log(myWidget.prototype.nonConstructorName); // "undefined"

console.log(myWidget.__proto__.constructorName); // "undefined"
console.log(myWidget.__proto__.nonConstructorName); // "undefined"

var myNewWidget = new Widget("myConstructorName3");

console.log(myNewWidget.nonConstructorName); // "nonConstructorName1"

Is there any difference between declaring variables inside the constructor vs. outside?

For functions, 'this' is bound differently, but for variables, I cannot figure out if there is a difference.

class Widget {
    constructor(constructorName) {
    this.constructorName = constructorName;
  }
  nonConstructorName = "nonConstructorName1";
}



var myWidget = new Widget("myConstructorName1");

console.log(myWidget.constructorName); // "myConstructorName1"
console.log(myWidget.nonConstructorName); // "nonConstructorName1"

myWidget.constructorName = "myConstructorName2";
myWidget.nonConstructorName = "nonConstructorName2";

console.log(myWidget.constructorName); // "myConstructorName2"
console.log(myWidget.nonConstructorName); // "nonConstructorName2"

console.log(myWidget.prototype.constructorName); // "undefined"
console.log(myWidget.prototype.nonConstructorName); // "undefined"

console.log(myWidget.__proto__.constructorName); // "undefined"
console.log(myWidget.__proto__.nonConstructorName); // "undefined"

var myNewWidget = new Widget("myConstructorName3");

console.log(myNewWidget.nonConstructorName); // "nonConstructorName1"
Share Improve this question edited Jan 20, 2016 at 13:54 Paolo Moretti 56k23 gold badges103 silver badges93 bronze badges asked Jan 20, 2016 at 8:25 M. Walker WellsM. Walker Wells 1512 silver badges7 bronze badges 9
  • Is this referencing my scenario? "There is (intentionally) no direct declarative way to define either prototype data properties (other than methods) class properties, or instance property." wiki.ecmascript/… – M. Walker Wells Commented Jan 20, 2016 at 8:30
  • 1 I am not sure if you can have properties inside the class definition in the way you are going to define it. Based on this : babeljs.io/docs/learn-es2015/#classes there is no property definition outside the constructor method, as well if you try your ES6 code here : babeljs.io/repl you will see that the ES6 transpiler produces an error for the property defnitition outside the constructor method. – KodeFor.Me Commented Jan 20, 2016 at 8:31
  • In case you like to have some private properties outsite the class construction then, maybe it's fine to read this question : goo.gl/qzau3o that has several good answers. – KodeFor.Me Commented Jan 20, 2016 at 8:37
  • @merianos-nikos: I'm transpiling with Babel 6, which doesn't throw an error, interestingly enough. – M. Walker Wells Commented Jan 20, 2016 at 8:42
  • 1 @merianos-nikos: The Babel REPL hasn't been upgraded to Babel 6 yet. – M. Walker Wells Commented Jan 20, 2016 at 8:48
 |  Show 4 more ments

1 Answer 1

Reset to default 5

Answer in ments by @merianos-nikos...

"The approach here is to use the scope of the constructor function, which is private, to store private data. For methods to have access to this private data they must be created within the constructor as well, meaning you're recreating them with every instance. This is a performance and memory penalty, but some believe the penalty is acceptable."

Private properties in JavaScript ES6 classes

发布评论

评论列表(0)

  1. 暂无评论