2016-07-05 4 views
1

JS 콘솔에 표시되는 방법을 사용자 정의내 객체가 나는이 불변 순위 객체를 구현 한

▶ Object {x: function, y: function} // Chrome 
Object { x: Pos/<.x(), y: Pos/<.y() } // Firefox 

이는 유용하지 않습니다. xy의 값을 볼 수 없기 때문입니다. xy을 기록하기 위해 사용자 정의 함수를 만들 수는 있지만 실제로 좋지는 않을 것입니다. 그리고 객체를 확장하고 내부를 탐색하는 유용한 가능성을 잃을 것입니다 (더 복잡한 객체를 상상해보십시오. Pos는 한 가지 예입니다).

C#에서 ToString()을 재정의하면 Visual Studio에서 자동으로 디버거에서 내 개체를 표시합니다.

JS에서는 toString을 구현하는 것이 전혀 도움이되지 않는 것 같습니다. 내 개체의 xy이 콘솔에서 쉽게 볼 수있는 방법이 있습니까?

+0

크롬은 이미 x와 y 값을 보여줍니다.이 값은 기능입니다. 게터를 원한다면 게터를 사용하십시오. 예를 들면 :'get x() {return _x; },'그렇지 않으면, 메소드를 실행하는 private var에 대한 링크가 없으며, 콘솔은 명백한 이유 때문에이를 수행하지 않습니다. – dandavis

+0

@dandavis 흥미 롭습니다. JS에 게터가 있다는 것을 몰랐습니다. 이것이 작동하는지 확인하겠습니다. –

+0

예, 많은 코더들이이를 간과하지만, ES5에 추가되었으며 현재 어디서나 사용할 수 있습니다 (ie8 +). – dandavis

답변

2

당신은 크롬에서 더 나은 콘솔 동작을 얻을 수있는, 어쩌면 다른 사람, 사용 ES5 게터 :

function Pos(x, y) { 
    return { 
     get x() { return x; }, 
     get y() { return y; }, 
    }; 
} 
console.log(Pos(1,5)); 

이 가능 낭비 CPU를 방지하려면, 크롬은 당신이 그것을 클릭 할 때까지 콘솔에서 게터을 CALC,하지만하지 않습니다 적어도 당신이해야 할 일 전부입니다. 그 이상으로, 당신은 자신 만의 로거 방법을 만들거나 완전히 맞춤화 된 객체를 사용해야 할 것입니다.

+0

getter가 콘솔에서 작동하는 것처럼 보입니다. ▶ Object {x : (...), y : (...)}'를 클릭 한 다음 (...)을 클릭하면 값이 확장됩니다 . C#만큼 좋지는 않습니다. 특히 볼 값이 많으면 좋지만, 아무것도 아닌 것보다 낫습니다. 고맙습니다. –