객체의 속성에 대한 프로토 타입의 자바 스크립트 설정 속성

Question

먼저 자바 스크립트의 프로토 타입 구조를 완전히 이해하지 못해서 이것이 가능하지 않을 수 있습니다. 내가 cube.x를 호출하면 cube.position.x에 해당한다는 obj 등에 속성 x을 추가하는 방법을 내가 가지고있는 경우

...

var vector = function(x, y) { 
    this.x = x || 0; 
    this.y = y || 0; 
} 

var obj = function() { 
    this.position = new vector(0, 0, 0); 
} 

var cube = new obj(); 

.... 각 참조의 속성을 동일한 값으로 만들 수 있어야한다고 생각하지만 구문에 대해서는 확실하지 않습니다. obj.position이 정의되지 않았기 때문에 obj.prototype.x = obj.position.x과 같은 것을 사용할 수 없습니다.

나는 다음과 같은 동작이 가능 싶습니다

alert(cube.position.x); // 0 
alert(cube.x); // 0 

cube.position.x = 2; 
alert(cube.position.x); // 2 
alert(cube.x); // 2 

cube.x = 4; 
alert(cube.position.x); // 4 
alert(cube.x); // 4 

이 가능합니까?

나는 Three.js로 작업 중이라는 사실을 언급해야한다. 그래서 객체를 다시 작성하는 것은 옵션이 아니며 단지 프로토 타입을 추가하는 것 뿐이다.

Answer 1

cube.x에 cube.position.x이 포함 된 값을 반환하려면 obj.prototype.x에 접근 자 및 변형자를 정의해야합니다. 액세서와 뮤 테이터는 JavaScript의 비교적 새로운 기능으로, 대부분의 IE 버전에서 지원되지 않습니다.

var vector = function(x, y) { 
    this.x = x || 0; 
    this.y = y || 0; 
} 

var obj = function() { 
    this.position = new vector(0, 0, 0); 
} 
obj.prototype = { 
    ...your prorotype methods here... 
}; 
Object.defineProperty(obj.prototype, 'x', { 
    get: function() { 
     return this.position.x; 
    }, 
    set: function (val) { 
     this.position.x = val; 
    } 
}); 

//alternatively: 
obj.prototype = { 
    get x() { 
     return this.position.x; 
    }, 
    set x(val) { 
     this.position.x = val; 
    } 
}; 

var cube = new obj(); 
cube.x; //0 
cube.x = 10; 
cube.position.x; //10