🟨 JavaScript/개념

[코딩앙마 외] 객체 리터럴과 객체 접근법, 그리고 생성자 함수

객체를 생성하는 방법에는 두 가지가 있다. 객체 리터럴 생성자 함수 단 하나의 객체만을 생성할 때는 직관적이고 간편한 객체 리터럴을 사용하고, 같은 객체를 대량생산할 때는 생성자함수를 사용한다. 객체 리터럴 const goodCoder = { name : 'Noran', age : 20, } * 수정/유지보수가 용이하도록 마지막 값에는 되도록 ,를 붙여주자. 객체.접근 goodCoder.name goodCoder['age'] 객체.추가 goodCoder.gender = "Female"; goodCoder.clothes = "sweatshirt"; 객체.삭제 delete goodCoder.clothes; 생성자 함수 (object constructor function) function Coder(name,..

[코딩앙마 외] 객체(Object)와 프로퍼티(property)

객체(Object) key와 value로 이루어질 수 있다. 1. 함수표현식 const goodCoder = function(name, age, coding) { name : 'Noran', age : 20, coding : function(){ console.log('화이팅!'); } } name : 'Noran', age : 20, coding fuction은 프로퍼티(property), name과 age는 key, 'Noran'과 20은 value이다. coding은 method(객체 프로퍼티로 할당된 함수)이다. 2. 함수선언문 function goodCoder(name, age, coding) { name : 'Noran', age : 20, coding : function(){ console...

[코딩앙마] 함수선언문과 함수표현식, 그리고 화살표함수 (추가)

함수선언문 (Function declaration) function goodCoder(){ console.log('Hello World'); } 어디서든 호출가능하도록 호이스팅된다. 함수표현식 (Function expression) let goodCoder = function(){ console.log('Hello World'); } 코드에 도달하면 생성된다. 함수선언문과 함수표현식의 차이점? 함수표현식은 할당된 다음부터 호출이 가능한 반면, 함수선언문은 호이스팅이 되어서 선언되기 이전에도 호출이 가능하다. 화살표함수 3단변신 여기 함수표현식이 있다. let goodCoder = function(code1,code2){ return code1 + code2; } 여기서 funtion이 빠지고 매개변수 뒤..

[드림코딩/코딩앙마] scope와 hoisting, 그리고 TDZ (추가)

scope 변수의 '수명' local scope global scope 1. local scope 지역변수(Local Variable)가 가지는 범위로, 함수가 실행되면 만들어지고 함수가 종료되면 소멸한다. 함수 외부에서는 접근할 수 없다. 2. global scope 전역변수(Global Variable)가 가지는 범위로 변수가 함수 외부에서 선언되어 프로그램 전체에서 접근할 수 있다. let globalMsg = 'global'; // global variable function printMsg() { let msg = 'hello'; console.log(msg); // local variable console.log(globalMsg); // 정상작동한다. } printMsg(); console...

[드림코딩/코딩앙마] strict모드와 var/let/const

'use strict'; 이 코드를 스크립트나 함수의 시작 부분에 선언하고 strict 모드로 개발한다면, 자동으로 허용되는 잘못된 코드를 오류로 변경하여 (존재하지 않는 변수/객체 등을 잡아내는 등) 모든 코드가 strict 모드에서 실행되어 불필요한 오류를 예방하고 성능 개선도 기대할 수 있다. (* es5에서 추가됨) 1. var var x = "Hello world"; var x = 0; //오류없이 작동한다. 선언+초기화 -> 할당 어디든 호이스팅이 가능한 선언방식이다. block scope을 전부 무시하고 function scope를 사용한다. 변수를 어느 곳에서나 불러온다. 위험부담이 크다. 그러나 es6 이후 아래 선언방식이 나온다. 2. let let x = "Hello world"; l..

[드림코딩] html에 js를 링크하는 여러가지 방법들

1. head 내부에 작성 위에서부터 HTML을 읽는다 (parsing html) -> blocked 된 상태에서 js를 읽는다. (fetching/executing js) -> 다시 HTML을 읽는다. 이 방법은 js가 용량이 크다면 웹사이트를 불러오는데까지 많은 시간이 소요된다. 2. body 내부에 작성 parsing html -> 페이지가 완료된 상태에서 js를 읽는다. (fetching/executing js) 사용자가 js가 적용되지 않은 웹사이트 (데이터나 DOM 요소가 꾸며지지 않은 상태) 를 js가 받아지기 전까지 보게 된다. 3. head 내부에 작성 (asyn) parsing하다가 js링크를 만나면 parsing과 병렬로 js를 읽다가 js가 받아지면(fetching) 실행(execu..