我有一个带有getter属性的ES6类(用babeljs反编译)。我知道默认情况下这些属性不可枚举。但是,我不明白为什么我无法使用Object.defineProperty
使该属性可枚举
// Declare class
class Person {
constructor(myName) {
this.name = myName;
}
get greeting() {
return `Hello, I'm ${this.name}`;
}
}
// Make enumerable (doesn't work)
Object.defineProperty(Person, 'greeting', {enumerable: true});
// Create an instance and get enumerable properties
var person = new Person('Billy');
var enumerableProperties = Object.keys(person);
// => ['name']
ES6风格的getter在原型上定义,而不是在每个person
上定义。要将greeting
属性设置为可枚举,您需要更改:
// Make enumerable (doesn't work)
Object.defineProperty(Person, 'greeting', {enumerable: true});
至:
// Make enumerable
Object.defineProperty(Person.prototype, 'greeting', {enumerable: true});
Object.keys只返回该对象自己的可枚举属性,因此不返回原型上的属性。您将在greeting
或Object.keys( Object.getPrototypeOf( person ) )
循环中找到for...in属性。 Updated Plunker
相反,如果您希望Person的每个实例都有自己的greeting
,您可以在构造函数中定义它:
class Person {
constructor(myName) {
this.name = myName;
Object.defineProperty( this, 'greeting', {
enumerable: true,
get: function ( ) { return `Hello, I'm ${this.name}`; }
} );
}
}
你可能会这样欺骗:
class Person {
static createFields({ name }) {
return {
name,
get greeting() {
return `Hello, I'm ${this.name}`;
}
}
}
constructor(...args) {
const inst = this.constructor.createFields(...args)
const desc = Object.getOwnPropertyDescriptors(inst)
Object.defineProperties(this, desc)
return this
}
}
好处是普通对象上的getter是可枚举的并且默认情况下是可配置的,您不必每次都关心这些修饰符。
但是......它看起来有点奇怪)不确定这是否真的应该使用。
类的非静态方法和访问器位于类的原型上,以便它的每个实例都继承它们。您可以通过实例访问它们,但它们不是实例的属性。静态方法和访问器位于类(这是一个函数)本身。
class Test {
#private_field = "A private field.";
public_field = "A public field.";
static get static_getter() {
return "A static getter.";
}
static static_method() {
return "A static method.";
}
get getter() {
return "A non-static getter.";
}
method() {
return "A non-static method.";
}
}
console.log(`Class ("${typeof Test}" type)`, Object.getOwnPropertyDescriptors(Test));
console.log("Its prototype", Object.getOwnPropertyDescriptors(Test.prototype));
console.log("Its instance", Object.getOwnPropertyDescriptors(new Test));
Class ("function" type) {
"length": {
"value": 0,
"writable": false,
"enumerable": false,
"configurable": true
},
"prototype": {
"value": {……},
"writable": false,
"enumerable": false,
"configurable": false
},
"static_getter": {
"get": ƒ static_getter() {……},
"set": undefined,
"enumerable": false,
"configurable": true
},
"static_method": {
"value": ƒ static_method() {……},
"writable": true,
"enumerable": false,
"configurable": true
},
"name": {
"value": "Test",
"writable": false,
"enumerable": false,
"configurable": true
}
}
Its prototype {
"constructor": {
"value": class Test {……},
"writable": true,
"enumerable": false,
"configurable": true
},
"getter": {
"get": ƒ getter() {……},
"set": undefined,
"enumerable": false,
"configurable": true
},
"method": {
"get": ƒ method() {……},
"writable": true,
"enumerable": false,
"configurable": true
}
}
Its instance {
"public_field": {
"value": "A public field",
"writable": true,
"enumerable": true,
"configurable": true
}
}
您可以使用Object.defineProperty
创建非静态访问器,它们是原型上的属性,可枚举。
class Person {
constructor(name) {
this.name = name;
}
get greeting() {
return `Hello from ${this.name}.`;
}
}
for(const property of ["greeting"]) {
Object.defineProperty(Person.prototype, property, {enumerable: true});
}
但这种方式大多没有用,因为大多数有用的功能,如Object.keys
,Object.values
,Object.entries
,JSON.stringify
等,只会寻找对象的自有属性。
您还可以将原型上的(复制)属性下载到实例。这样他们就不再继承原型中的属性,而是将它们作为自己的属性。
class Person {
constructor(name) {
this.name = name;
for(const property of ["greeting"]) {
const descriptor = Object.getOwnPropertyDescriptor(Person.prototype, property);
const modified_descriptor = Object.assign(descriptor, {enumerable: true});
Object.defineProperty(this, property, modified_descriptor);
}
}
get greeting() {
return `Hello from ${this.name}.`;
}
}
const alice = new Person("Alice");
console.log(alice.greeting);
console.log(JSON.stringify(alice));
console.log(Object.entries(alice));
const prototype = Object.getPrototypeOf(this);
const prototype_property_descriptors = Object.getOwnPropertyDescriptors(prototype);
for(const [property, descriptor] of Object.entries(prototype_property_descriptors)) {
const is_nonstatic_getter = (typeof descriptor.get === "function");
if(is_nonstatic_getter) {
descriptor.enumerable = true;
Object.defineProperty(this, property, descriptor);
}
}