[javascript] 자바 스크립트에서 [] 연산자를 어떻게 오버로드 하시겠습니까?

자바 스크립트에서 [] 연산자를 오버로드하는 방법을 찾을 수없는 것 같습니다. 아는 사람 있어요?

나는 생각하고 있었다 …

MyClass.operator.lookup(index)
{
     return myArray[index];
}

아니면 내가 옳은 일을보고 있지 않습니까?



답변

JavaScript에서는 연산자를 오버로드 할 수 없습니다.

ECMAScript 4 용 으로 제안 되었지만 거부되었습니다.

조만간 볼 수 없을 것 같습니다.


답변

ES6 프록시 ( 모든 최신 브라우저 에서 사용 가능)로이 작업을 수행 할 수 있습니다.

var handler = {
    get: function(target, name) {
        return "Hello, " + name;
    }
};
var proxy = new Proxy({}, handler);

console.log(proxy.world); // output: Hello, world

MDN에 대한 자세한 내용을 확인하십시오 .


답변

간단한 대답은 JavaScript가 대괄호를 통해 객체의 자식에 액세스 할 수 있도록 허용한다는 것입니다.

따라서 클래스를 정의 할 수 있습니다.

MyClass = function(){
    // Set some defaults that belong to the class via dot syntax or array syntax.
    this.some_property = 'my value is a string';
    this['another_property'] = 'i am also a string';
    this[0] = 1;
};

그러면 두 구문 중 하나를 사용하여 클래스의 모든 인스턴스에서 멤버에 액세스 할 수 있습니다.

foo = new MyClass();
foo.some_property;  // Returns 'my value is a string'
foo['some_property'];  // Returns 'my value is a string'
foo.another_property;  // Returns  'i am also a string'
foo['another_property'];  // Also returns 'i am also a string'
foo.0;  // Syntax Error
foo[0];  // Returns 1
foo['0'];  // Returns 1


답변

프록시를 사용하십시오. 답변의 다른 곳에서 언급되었지만 이것이 더 나은 예라고 생각합니다.

var handler = {
    get: function(target, name) {
        if (name in target) {
            return target[name];
        }
        if (name == 'length') {
            return Infinity;
        }
        return name * name;
    }
};
var p = new Proxy({}, handler);

p[4]; //returns 16, which is the square of 4.


답변

대괄호 연산자는 실제로 속성 액세스 연산자이므로 getter 및 setter로 연결할 수 있습니다. IE의 경우 대신 Object.defineProperty ()를 사용해야합니다. 예:

var obj = {
    get attr() { alert("Getter called!"); return 1; },
    set attr(value) { alert("Setter called!"); return value; }
};

obj.attr = 123;

IE8 +에서도 동일 :

Object.defineProperty("attr", {
    get: function() { alert("Getter called!"); return 1; },
    set: function(value) { alert("Setter called!"); return value; }
});

IE5-7의 onpropertychange경우 이벤트 만 있으며 DOM 요소에는 작동하지만 다른 개체에는 작동하지 않습니다.

이 메서드의 단점은 미리 정의 된 이름이없는 임의의 속성이 아니라 미리 정의 된 속성 집합에 대한 요청 만 연결할 수 있다는 것입니다.


답변

설명대로 Proxy를 사용해야하지만 궁극적으로 클래스 생성자에 통합 될 수 있습니다.

return new Proxy(this, {
    set: function( target, name, value ) {
...}};

‘this’와 함께. 그러면 set 및 get (또한 deleteProperty) 함수가 실행됩니다. 비록 당신이 다른 것처럼 보이는 Proxy 객체를 얻더라도 그것은 대부분의 경우 비교 (target.constructor === MyClass)를 요청하기 위해 작동합니다. 그것은 클래스 유형 등입니다. 텍스트 (약간 다르게 작동하는 예를 언급합니다.)]


답변

그래서 당신은 var whatever = MyClassInstance [4]; ? 그렇다면 간단한 대답은 Javascript가 현재 연산자 오버로딩을 지원하지 않는다는 것입니다.