개인코딩개발공장

흔히들 메서드는 객체안에 존재하는 함수? 같은걸로 생각을 한다. 뭐 기능면에서는 동작이야 다 잘되겠지만.. 일단 아래코드를 보자. 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..

# 변수의 목숨이 붙어있는 시간 딥다이브에선 이걸 변수의 생명주기라고 하는데.. 그냥 이 변수를 참조할수 있는 시간을 말한다. //존나 //오래 //걸리는 //코드1 var value = '멍청이'; //존나 //오래 //걸리는 //코드2 이런식으로 전역스코프에 변수 value를 선언하였다 이걸 그림으로 그려보면 자바스크립트는 선언부분을 다 끌어올린다. 그래서 모든 식별자에는 메모리주소가 연결되고 그곳에있는 값으로 참조할 수 있다. 그림을 좀 복잡하게 그렸는데 걍 전역에서 선언한 변수는 코드가 끝날때까지 참조할 수 있다는거다.. 사실 그림이 정확하지 않는데 순서대로라면 선언부분 var value부분만 먼저 실행되고 오래걸리는코드1동안 undefined로 참조되고, 그다음 value = '멍청이'재할당문이..

# 스코프란 무엇일까? {} //블록레벨 스코프? function fuc(){} //함수레벨 스코프? 스코프를 대충 중괄호다 라고 생각하는 사람들도 있을거다. 스코프에 대해서 어떤것인지 정확히 생각해보자. # 스코프란 식별자가 유효한 범위다. // --우주어딘가(전역) { // --집밖 var dog = "무찌"; { // -- 우리집 { // -- 무찌전용침대 다이소5천원짜리 } } } 얜왜 테두리 검은색이냐 // --우주어딘가(전역) { // --집밖 let dog = "무찌"; { // -- 우리집 { // -- 무찌전용침대 다이소5천원짜리 } } } 요렇게 var이나 let으로 선언한 dog이라는 변수에 값으로 무찌가 바인딩 되어있다. 그리고 블록문을 중첩해서 써놨다. 대충 이름붙여서 우주/집밖/..

# 일반적인 선언문 let value = "바보"; console.log(value); 일반적인 선언문은 이렇게 생겼다. 그런데 자바스크립트는 ㅈ같이도 아래와 같은 코드도 동작한다. # let var const없이 선언한 변수 value = "바보"; console.log(value); 잘불러온다..ㅡㅡ 이걸 use strict와 같이쓰면 에러뿜어준다. 될수있으면 선언문을 쓸때 let const를 써서 변수선언을 하자. 파이썬에서 온 사람들은 이거 짜증날거다 ㅠ 근데 이건 변수선언이 아니다! # 이러한 경우에서 호이스팅은? console.log(value); value = "바보"; 없는 value를 참조하려했다고 에러뿜어준다. 이 코드가 변수선언으로 동작할때는 호이스팅이 된다고 볼수 없다.(아래에 더씀..

# 호이스팅이란? https://jacobowl.tistory.com/136 변수 호이스팅, 그리고 초기화 initialize, Temporal Dead Zone 초기화는 변수선언시에 최초로 undefined가 할당이 되는것을 말한다. 먼저 그림으로 살펴보면, let value = 'hello world'; 라는 코드가 실행되면 먼저 식별자 value가 가르키는 메모리주소1이 생성되고 이 jacobowl.tistory.com 이전에 변수의 호이스팅에 대해서 포스팅을 했었다. 코드는 위에서 아래로 순차적으로 실행되지만 변수를 선언하기전에 참조가 가능한걸 변수호이스팅이라고 한다. 함수도 이렇게 정의(함수는 선언이 아니라 정의라고함)하기 이전에 호출이 가능한걸 함수 호이스팅이라고 한다. # 함수 선언문에서의 ..

# 기명함수와 익명함수console.log(function fuc() { return "뿩!"; }, ": 기명함수/ 이름이 있는 함수래~"); console.log(function () { return "뿩!"; }, ': 익명함수/ 이름이 없는 함수래~');둘다 함수리터럴로 평가되서 함수객체를 참조한다. 기명함수와 익명함수를 함수리터럴로 참조해서 콘솔로찍어보면 저렇게 참조한다. 브라우저에서 console.dir로 보면 명확히 알 수 있다.브라우저상에서 console.dir로 프로퍼티들을 살펴보면 name을 키로 갖는 프로퍼티에 기명함수는 'fuc'라는 스트링이 값으로 나와있고, 익명함수는 그냥 빈 스트링 ""이 나와있다. # 함수이름console.dir(function fuc() { return "뿩..

# 먼저 리터럴에 대해서 다시 살펴보자. https://jacobowl.tistory.com/137 값(value), 리터럴(literal), 표현식(expression), 문(statement)# 리터럴(literal) 리터럴은 사람이 알아보는 기호로 적은 표기법을 말한다. 이전 '메모리에 저장되는 기본구조' 포스팅에서 컴퓨터는 데이터를 2진법으로 저장한다고 했었다. 메모리에 저장되는 jacobowl.tistory.com 위 포스팅에서 리터럴에 대해서 설명을 했었다. 리터럴이란 우리가 직접 vs코드에 치는 사람이 알아볼수 있는 코드이고, 이 리터럴이 자바스크립트엔진에의해 평가되어 메모리에 값으로 저장된다. 리터럴은 표현식에 포함된다. # 함수는 객체다 https://jacobowl.tistory.com..