개인코딩개발공장

const Dog = function () { this.name = "도리"; }; const dog1 = new Dog(); const dog2 = new Dog(); dog1.__proto__.sayHello = function () { console.log("헬로우 도리"); }; // 이건 dog1 dog2둘다 사용가능 dog1.__proto__ = { sayHello() { console.log("헬로우 무찌"); }, }; //이건 dog1꺼만 바꿈. // dog1.sayHello(); dog2.sayHello(); const Dog = function () { this.name = "도리"; }; const dog1 = new Dog(); Dog.prototype = { sayHello() ..

# 왜 이런걸 포스팅할까? 난 이책을 읽기전에 예전에 인수가 파라미터고 파라미터가 인수인줄 알았다. 뭐사실 중요한건가 싶기도했는데 자스를 깊게 파보기로 했으니 용어정리는 매우 중요하다고 생각한다. 함수에서 인수와 파라미터의 차이에 대해 명확히 구분하기 위해서 포스팅한다. # 매개변수란?(parameter) const fuc = function (parameter1, parameter2) { console.log(parameter1, parameter2); }; 이렇게 간단한 함수를 만들어봤다. 여기서 parameter1과 parameter2가 매개변수다. 함수를 정의할때 만들어주는것이 매개변수라고 보면된다. # 인수란?(argument) fuc("무찌", "도리"); // 무찌 도리 출력 위에서 만든 함..

# 일급객체란? 일단 일급객체 용어부터 정리하면 1. 무명의 리터럴로 생성할 수 있음. 런타임 생성 가능 const fuc = function(){ return } 뭐 이런뜻인듯? 중첩함수에서 만들어지는게 런타임중 만들어지는 함수인가..? 암튼 2. 변수나 자료구조에 저장할 수 있다. 3. 함수의 매개변수에 전달할 수 있다. 4. 함수의 반환값으로 사용될 수 있다. 2,3,4번은 그냥 함수리터럴이 메모리에 함수객체로 저장되는 표현식이니까 당연한거.. 3번은 자주쓰이는 콜백함수다. 뭐 이렇단다.. 아직 중요한지는 모르겠음. # 함수객체의 프로퍼티 함수객체를 console.dir로 찍어보자 const fuc = function () { return; }; console.dir(fuc); 저렇게 argumen..

const checkJokbo = (para, count) => { if (typeof para !== "object") { console.log("객체만 써"); return; } else { if (!count || 0) { console.log(`조상님 찾기 시작!`); count = 1; } else { count = count; } if (para.__proto__ == Object.prototype) { console.log(`${count}촌 : Object`); console.log("조상님 찾기 끝!"); return; } else { console.log(`${count}촌 : ${para.__proto__.constructor.name}`); count++; checkJokbo(par..

# 왜 포스팅하니? getter setter 프로퍼티를 접하고 신기해서 써봄.. 이 문법에대해서 사실 몰랐다. 근데 생각보다 꽤나 유용할것 같아서 포스팅하려고 함. # 내가 문제로 삼았던것. const obj = { dog1: "무찌", dog2: "도리", teamName: obj.dog1 + obj.dog2+'듀오', }; 위 코드는 에러가 뜬다 요렇게 참조에러가 뜬다. teamName프로퍼티가 dog1과 dog2를 참조하는건데 teamName프로퍼티가 자기자신 obj를 참조하는 시점이 실행컨텍스트의 코드평가할때 참조하려고해서 참조에러가 뜨는거다. 호이스팅이 발생하는거지. 그래서 이걸 억지로 만들어보려면..? - 즉시실행함수 const obj = { dog1: "무찌", dog2: "도리", }; (..

객체지향을 모르고 걍 코더로써 코딩을 할때 이 세가지의 차이를 잘 몰랐었다. 근데 사실 계속 코드짜면서 굳이? 왜 클래스로 객체를 만들까? 이런 의문은 있었다. 뭐 이걸 공부하기 전까진 동작이되게 코드를 짜는정도 수준이었던것같다. 그래서 이번에 공부하다가 이 세가지의 차이점에 대해서 명확하게 구분하기위해 포스팅을 해보겠다. 일단 세가지 예시코드를 보자~ # 객체를 리턴하는 함수 const makeDog = (name, age) => { return { name, age }; }; 저 함수를 호출하면 객체가 튀어나온다. console.log(makeDog("무찌", 2)); //{ name: '무찌', age: 2 } 이렇게 함수에다가 적절한 파라미터를 넣고 함수를 호출하면 객체를 만들 수 있다. # 생성..

흔히들 메서드는 객체안에 존재하는 함수? 같은걸로 생각을 한다. 뭐 기능면에서는 동작이야 다 잘되겠지만.. 일단 아래코드를 보자. const obj = { 화살표함수: () => { console.log("화살표함수"); }, 메서드() { console.log("메서드정의방식 메서드"); }, 표현식: function () { console.log("표현식"); }, }; 객체 obj에 저렇게 프로퍼티? 메서드를 써봤다. 일단 코드에서 봐서 알겠지만 저기서 메서드라고 적힌 함수?만 메서드다 일단 다 호출해보면 모두 제대로 호출된다. const obj = { 화살표함수: () => { console.log("화살표함수"); }, 메서드() { console.log("메서드정의방식 메서드"); }, 표현식..

# 기본 코드 const Dog = function (name) { this.name = name; }; const dog1 = new Dog("무찌"); Dog라는 생성자 함수와 이 생성자 함수로 새로운 객체를 만들어, 식별자 dog1에 할당했다. 기본적인 생성자함수의 문법이다. # Dog의 프로퍼티 console.dir(Dog); 위 코드를 쳐보면 뭐 이렇게 생겼다. 우리가 주목할건 저 prototype이라는 프로퍼티다. 저 prototype프로퍼티를 또 펴보면 요렇게 생겼고 constructor이라는 프로퍼티가 또 들어있다. 저 constructor이라는 프로퍼티를 또 펴보면 얘는 Dog라는 함수란다.. 읭? 우리가 처음 만든 Dog 생성자 함수다. 여기엔 또 prototype이 들어있다. 저 pr..

# 프로퍼티가 뭘까? 다시 생각해보자. const obj = { key: "value", }; 뭐 이런식으로 생긴게 객체라고 생각을 한다.. 저 코드만 봐서 보이는게 obj라는 식별자(객체참조)랑.. key, value라는 키,값이 쌍으로 보인다. 저 코드에선 객체, 키, 값은 명시적으로 보이지만 프로퍼티?라는건 사실 크게 안보인다. 그래서 프로퍼티라는 용어를 난 코딩할때 잘 안썼었음.. 정확히는 저 키와 값 한쌍을 프로퍼티 하나라고 부른단다. 메서드는 뭐 다른 개념이고.. 암튼 그룹개념으로 나눠보면.. 뭐 이렇게 생각을 해보장 # 내부슬롯 내부 메서드 근데 저 위에 그림은 뭔가 좀 음.. 조금 안맞는 느낌이 있어서 그림을 그려보겠다. 일단 이 이유는 아래코드를 쳐보자 console.log(Object...

# 일반적인 코드에서 식별자에 접근해서 참조해보자 - var선언 var dog = "무찌"; 개발자도구 콘솔에서 dog를 타이핑하면 저렇게 참조값을 가져와준다. 이게 전역변수로 선언된거다 ++ let이나 const는? 얘네는 개발자도구 콘솔에서 undefined로 뜬다. 그 이유는 실행컨텍스트에서 선언적환경레코드(declarative enviroment record)에 존재한다고 한다. 이건 아직 뭔지모르겠음. # 그럼 코드 전체를 즉시실행함수 리터럴로 감싸고 호출해보면? (function () { var dog = "무찌"; })(); 이렇게 식별자 참조를 할 수가 없게된다. 이렇게 즉시실행 함수로 코드 전체를 감싸면 전역변수생성을 막을 수 있다. # 모듈패턴 사실 오늘 포스팅은 이게 메인이다.. le..