prototype] function 에 붙어있는 미확인 파라메터 탐색선언자군요..

0)
함수 object 에 prototype 이라는 항목이 있는데요,
prototype 을 어떻게하면 효율적(?)으로 사용할까..라는 생각..이전에,

prototype 을 어떻게 쓰는건지 궁금했습니다.

* 참고 * 
ISBN 978-89-6626-015-7 JavaScript Patterns
113page - 프로토타입과 비공개 멤버..

... 

1)

<div id=d120418_1>output1</div>
<div id=d120418_2>output2</div>
<div id=d120418_3>output3</div>
<div id=d120418_4>output4</div>
<div id=d120418_5>output5</div>
<script>

(

function() {
  var Gadget = function() {
    this.getName = function() {
      return this.name
    };
    // this.prototype=.. 형식은 넣어도 적용 안됩니다. prototype 인수(?)받은 후에 function 함수 실행이 되니까요.
  };

  var toy = new Gadget();

  Gadget.prototype = {
    name: 'Safari',
    getBrowser: function() {
      return this.name;
    },
    setBrowser: function(v) {
      this.name = v;
    },
    deleteName: function(v) {
      delete this.name;
    }
  }

  var
  tuy = new Gadget();

  document.getElementById('d120418_1').innerHTML = toy.getName() + ' ' + (toy.getBrowser ? toy.getBrowser() : '*none-function*');

  document.getElementById('d120418_2').innerHTML = tuy.getName() + ' ' + (tuy.getBrowser ? tuy.getBrowser() : '*none-function*');

  tuy.setBrowser('Chrome');
  document.getElementById('d120418_3').innerHTML = tuy.getName() + ' ' + (tuy.getBrowser ? tuy.getBrowser() : '*none-function*');

  tuy.deleteName();
  document.getElementById('d120418_4').innerHTML = tuy.getName() + ' ' + (tuy.getBrowser ? tuy.getBrowser() : '*none-function*');

  tuy.deleteName();
  document.getElementById('d120418_5').innerHTML = tuy.getName() + ' ' + (tuy.getBrowser ? tuy.getBrowser() : '*none-function*');

})();

</script>

...

output1

output2

output3

output4

output5

...

2)
Gadget 함수를 prototype 없이 적용한
toy 변수 예시와 

prototype 을 적용한
tuy 변수에
name 값을 적용한 예시입니다.

3)
첫번째 줄은, prototype 을 적용하지 않았으니
Gadget 을 이용해 만든 object 에 name 항목이 없어서 "undefined",
역시, getBrowser 함수도 항목이 없어서 "undefined" 입니다.

두번째 줄은, prototype 을 적용한 후인데,
object 내에는 name 항목이 없지만, prototype 에서 name 항목을 찾아서 "Safari" 가 넘어왔구요,
getBrowser 함수도 prototype 에서 찾을 수 있기 때문에 "Safari" 가 넘어왔습니다.

세번째 줄은, setBrowser 함수를 이용해서 name 항목에 적용한 예시입니다.

네번째 줄은 setBrowser 함수를 이용해서 적용한 name 값을 삭제한 예시입니다.

다섯번째 줄은 name 값을 다시 삭제하려는 예시입니다.

4)
세번째 줄 까지는 금방 이해를 하실 수 있겠습니다만,

네번째 줄은 세번째 줄에서 선언한
"object 내에서의 name 항목"을 삭제한 케이스입니다.
prototype object 에 있는 name 항목을 삭제한 것은 아니죠.

결국, 세번째줄에서 선언한 name 은 
해당 object 내에 적용할 경우라, 
name 항목을 바로 찾을 수 있기 때문에 "Chrome"이 넘어왔구요..

네번째 줄에서 삭제한 name 은
해당 object 내에 있는 name 항목인데,
name 을 다시 부를 때, 삭제한 항목이라 없기 때문에 prototype 으로 선언해둔
name 값을 찾아와 "Safari"가 넘어온거죠.

5) 
다섯번째 줄..에서 조금 애매(?)할 수는 있습니다. 
해당 object 내에 name 항목이 없으면 prototype 의 name 을 의미하는게 아닐까..하구요..

하지만, 항목 선언시에 적용되는 타겟이냐와,
항목을 못찾았을 경우 prototype 적용값을 추적하느냐..는 조금 달라서요.. 

결국, 삭제하려던 name 항목은 그냥(?) 못찾는 것이고,
값을 불러올 땐 prototype 으로 선언했던
name 항목까지 찾아내서 "Safari"가 넘어오게 되는거죠.

...

6)
정리를 하자면(?),

function object 에 선언하는
prototype 항목은 
function 이 new 를 이용해서 object 를 만들었을 때 사용되며, (첫번째의 undefined..) 

해당 항목명을 못찾았을 땐
prototype 으로 선언된 값을 추적해서 찾아오고, (두번째 Safari)

선언, 삭제를 할 때는
해당 object 에 있는 항목을 직접 지정하며, (세번째 setBrowser, 네번째 deleteName) 

삭제하려는 해당 항목이 없을 땐, 
해당 항목명을 찾지못한다고 오류를 내지 않고, 그냥 종료를 합니다. (다섯번째 deleteName)

... 이런 내용이네요.

탐색 node(?) 가 prototype 선언을 이용해서 적용되는 것 까지는 알겠는데..
음.. 실제 활용에서는 더 복잡(?)하게 전개할 수 있다는게 흥미롭습니다.

easyBow killofki@.