let myVoca = {
addVoca: function (key, value) {
myVoca[key] = value;
},
deleteVoca: function (key) {
delete myVoca[key];
},
printVoca: function (key) {
console.log("${key}"의 뜻은 "${myVoca[key]}"입니다.);
},
};

위처럼 객체가 이렇게 정의가 되어있을 때,

myVoca.addVoca('parameter', '매개 변수');
myVoca.addVoca('element', '요소');
myVoca.addVoca('property', '속성');
console.log(myVoca);

이렇게 객체에 프로퍼티를 추가하고 호출하는 것까지는 흐름상 이해가됩니다.

그런데, 호출 콘솔값이

{
addVoca: [Function: addVoca],
deleteVoca: [Function: deleteVoca],
printVoca: [Function: printVoca],
parameter: '매개 변수',
element: '요소',
property: '속성'
}

이렇게 결과가 나오는 과정?이 모르겠습니다 ㅠㅠ

addVoca:[Function: addVoca]는 어떤 호출값으로 인해 나오게 된것인지,, 또 parameter: '매개 변수' 이 콘솔값을 볼 때 분명 addVoca인데 왜 parametr 또는 element로 값이 나오게되었는지..

제가 너무 개념을 모르고있는걸까요? 다시 첫 강의부터 변수,함수,파라미터 개념을 다시 잡고와야하는건지..ㅠㅠ

호출하는 부분에 번호를 매겨 볼게요
1. myVoca.addVoca('parameter', '매개 변수');
2.myVoca.addVoca('element', '요소');
3.myVoca.addVoca('property', '속성');
4.console.log(myVoca);


1.2.3.에서 addVoca라는 함수를 호출하면 myVoca(객체)를 직접적으로 수정하지 않으면서 property를 추가합니다.
왜냐하면 addVoca라는 함수는 주어진 파라미터 값을 통해서 property값을 추가하도록 선언했기 때문입니다. 그래서 1.2.3. 과정을 거치면 객체에는 눈에 보이지 않는 property 값 3개가 추가로 생겼다고 생각하면 될듯합니다.
마지막 4.은 콘솔창에 myVoca를 호출합니다. 아까 myVoca에는 기존 3가지 함수외에 3가지 property가 추가로 있다고 했죠? 그래서 함수 다음에 parameter: '매개변수'~~가 보이는 겁니다.