익명의 개발노트

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..

오늘은 Test builder에 대해서 공부를 해보았다. TDD의 개념과 Test Frame work 사용법. 자바스크립트에는 Mocha와 chai라는 것이 있다. 테스트 빌더 과제를 꼬박 12시간 걸린 듯 하다... 생각보다 어려웠다. Mocha는 테스트 프레임워크로 노드에서 주로 많이 쓰고, 함수단위 테스트가 가능하다. 참고자료 : https://mochajs.org/ chai는 자바스크립트와 프레임워크를 페어링 할 수 있는 노드와 브라우져를 위한 BDD / TDD 라이브러리다. chai.api로 사용하고 대표적으로 expect 와 should() 가 있다. 참고자료 : https://www.chaijs.com/ Q> 그럼 Mocha와 chai 통상 둘다 사용하는지, 하나만 사용하는지 궁금하고, 각각..

크롬을 활용한 디버깅하는 법을 알아보자. 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) 음의..