익명의 개발노트

콜백 함수 : 함수를 인자로 넘기는 함수. ex) function executableCode(){ } function otherCode(callback){callback();} 위 결과에서 1. otherCode(executableCode); 입력하면?? //undefinded 2. otherCode(executableCode()); 입력하면?? //typeEr ror 2번째는 클로져로 실행하면 됨.

비동기 호출이라고도 한다. 동기 호출과 비동기 호출의 차이점을 먼저 보면, 예) 식당에 간다. 식당에 왔다.메뉴판을 본다.김밥을 주문한다.테이블을 셋팅한다.김밥을 먹었다.계산한다. 위와 같은 흐름으로 진행한다 하면, 동기식은 순서대로 진행한다. 그렇기때문에 김밥을 주문하고 김밥이 나올때까지 암것도 못한다. 하지만 비동기식은 김밥주문하고 테이블 세팅하고 김밥나오면 먹으면 된다. 먼저 요청하고 응답받을때까지 기다리는게 아니라, 다른거 하면서 기다리는 거다. 통상 서버와의 요청시에 비동기식을 사용한다. 비동기식 사용 유형은 크게 3가지 1. 이벤트 핸들러2. 타이머에서 콜백(애니메이션)3. 서버에 자원요청(fetch이용) 대표적인 비동기식 함수는 setTimeout함수가 있다. 특징이 시간에 0을 넣어도 동기..

자바스크립트에서 Arguments 는 모든 function() 안에서 사용할 수 있는 지역변수이다. 자바스크립트 프로그래밍에서 중요하다고 하며, 자바스크립트 라이브러리는 arguments 객체를 사용하기 때문에 자바스크립트 개발자라면 사용법에 익숙해야한다. 특징을 살펴보자. 1. argument는 함수 내에서 변수를 통해 접근할 수 있다. 2. 호출된 arguments 는 함수에 전달된 인수(arguments)를 배열 형태의 object로 표현한 것이다.. 하지만, 실제 배열은 아님. 유사배열?! 그래서, Array의 메소드를 .length 빼고 사용할 수 없음. ※ arguments.length는 실제 함수에 사용자가 넣은 인자(파라미터) 의 갯 수임. ex) function one(arg1){......

Immediately Invoked Function Expression 번역하면 즉시 실행함수 이다. 사용목적은 스코프 문제 때문에 사용한다. 이름이 없는 함수이기 때문에 argument나 value값을 넘겨줄때도 쓴다. 가독성도 많이 떨어지기는 단점이 있다. IIFE에 변수를 할당하면 IIFE 자체에 저장이 되지 않고 함수가 실행된 결과만 저장된다. (function () { var aName = "Barry"; })();이런식으로 function 의 시작과 끝을 아기를 포대기에 감싸듯 ( ) 를 사용하여 감싸준다. IIFE 안에서 포문을 돌릴 경우 var i 이런식으로 주는경우도 있는데, let i로 사용하면 IIFE를 굳이 사용하지 않아도 된다. 또는 .bind를 사용해도 IIFE를 굳이 사용하지 ..

execution contexts (실행컨텍스트) 1) 정의 : 프로그램이 실행될때, 빌드업 하는 과정에서 메모리 안에 스코프 구조들을 excution context라고 부른다. 2) 어떤 함수가 호출되면 실행 컨텍스트 execution context가 만들어진다.(call stack에 push, 함수 벗어나면 pop됨)함수가 실행되면 실행컨텍스트가 생성되고 => 매개변수의 정보를 가지는 활성객체를 생성(arguments, 유사배열)하고, 함수가 생성될 때 상용된 인자(parameter)를 넣는다. => 활성객체 안에 실행 컨텍스트의 스코프 체인을생성 => 함수가 가지고 있는 변수 및 객체 정보를 담을변수객체 생성한다. 이때의 값은 아직 할당하지 않았으므로, undefined이다. => this에 대한 ..

클로져란? 1) 외부함수의 변수에 접근할 수 있는 내부 함수( 외부함수가 실행 종료되어 소멸했음에도 불구하고 내부함수는 외부함수의 변수에 접근가능) 2) scope chain으로 표현되기도 함 3) 보통함수를 return 하여 사용 4) return 하는 내부함수를 클로져 함수라고 지칭 function outer() { console.log('outer fn invoked'); function inner() { console.log('inner fn invoked'); } return inner;} outer(); // → outer fn invoked, ƒ inner() { console.log('inner fn invoked'); }outer()(); // → outer fn invoked, inne..

요약.1. 하위스코프는 글로벌스코프에 접근가능하다. 2. var는 함수단위, let, const는 블록단위 스코프임.3. 전역변수와 window객체4. 선언없이 초기화된 변수는 전역변수 (매우 위험햇) 5. 호이스팅 (호이스팅은 var에서만 해당됨) 선언과 할당이 분리되어있어서, 선언만 호이스팅해감. 규칙 1. Local scope vs Global Scope 1) 기본적으로 scope는 중첩이 가능하고, 하위 scope가 상위 scope의 변수에 접근이 가능하다. -> 상위 scope 변수가 하위scope 변수 접근불가. 2) Global Scope는 어디에서도 접근이 가능하다. 3) 지역변수는 함수 안에서 전역변수보다 높은 우선순위를 가진다. 규칙 2. Block level vs function le..

크롬을 활용한 디버깅하는 법을 알아보자. 1. console.log()를 이용한 방법 2. Breakpoint를 이용한 방법 우선 1번 사항은 시간이 2번 사항에 비해서 코드구조, 로직 흐름을 이해해야하기때문에 느리다. function updateLabel() { var addend1 = getNumber1(); console.log('addend1:', addend1); var addend2 = getNumber2(); console.log('addend2:', addend2); var sum = addend1 + addend2; console.log('sum:', sum); label.textContent = addend1 + ' + ' + addend2 + ' = ' + sum; } 따라서, 2번사..

배열 문법은 상당히 많이 있다.(immutable) : 원본이 변하지 않음.(mutable) : 원본이 변함 1. concat() : 배열간에 연결하려면 concat() 사용. arr1.concat(arr2); 2. every() / some() : every는 조건에 만족하면 무조건 트루, some은 반대 3. fill() : 하나의 값으로 채우는거(채울꺼, 인덱스시작위치, 인덱스어디까지/기본이 this.length) 4. shift() : 배열 맨 앞에꺼 제거 (mutable) 5. unshift() : 배열 맨 앞에 집어넣기 6. reverse() : 역으로 정렬 7. sort() : 정렬 8. isArray : 검사할 객체 넣어주면 됨. 9. forEach : 리턴값 필요없음, 알아서 리턴 (im..

자바스크립트에서 falsy, Truthy 개념이있다. 기본적으로 타입체크하려면 typeof 변수명 을 사용하면 타입을 확인할 수 있다. 1. falsy if (false)if (null) => 값이 없음 if (undefined) => 값이 정의되지 않음. 값은 있을 수도 없을 수도 있음 if (0) 영 if (NaN) Not a Number 숫자가 아님. 계산 잘못되었을 경우 발생. if ('') if ("") if (``) if (document.all) //legacy code 2. Truthy if (true) if ({}) if ([]) if (42) 양수 if ("foo") 문자열 if (new Date()) 시간날짜 if (-42) 음수 if (3.14) 양의 소숫점 if (-3.14) 음의..