FE BE 개발 메모장/Javascript
클로저(Closure)란?
클로저를 알기 위해서는 우선 먼저 기본적인 개념 몇가지를 알아야 한다고 생각한다. 일급 객체, 일급 함수 자바스크립트의 함수는 일급 함수이며, 함수는 사실 객체이므로 일급 객체라고도 한다. 클로저를 다루기 전에 일급 객체에 대헤서 반드시 알아야 한다. 어휘적 범위 지정(Lexical scoping) Lexical Scoping은 함수를 어디에 선언했는지에 따라 스코프가 결정되는 것을 말한다. 우선 스코프라는 것은 함수를 선언할 때 생기는 개념이라 정적스코프라고도 불린다. 함수를 어디에 선언하던 스코프에는 영향을 끼치지 않는다. 아래 예시를 보자. var browsers = "Chrome"; function browser() { console.log(browsers); } function defaultBr..
자바스크립트 함수의 범위(Scope)
스코프(Scope) Scope는 범위라는 뜻을 가지고있는데, 자바스크립트에서는 함수를 선언 할 때 생기는 개념이고, 두 가지 타입이 존재한다 전역 스코프와 지역 스코프 두가지다. 변수에 접근할 수 있는 범위를 의미한다. 전역 스코프(Global Scope) - 전역 스코프는 변수가 전역에 선언되어 있어 어느곳에서든지 변수에 접근이 가능하다. 전역 스코프에 선언된 변수는 전역 변수라 하며, Window 객체의 변수가 된다. 지역 스코프(Local Scope) - 지역 스코프는 해당 지역에서만 접근이 가능하며, 지역을 벗어난 곳에선 접근이 불가능하다. 함수를 생성하고, 함수 내부에서 선언된 변수를 지역변수, 함수의 지역변수라고 한다. let x = 1; //전역 스코프에 선언된 변수 = 전역 변수 //win..
자바스크립트에서 호이스팅이란?
호이스팅(Hoisting)의 기본 개념 함수 안에 있는 선언들을 모두 끌어올려서 해당 함수 유효 범위의 최상단에 선언하는 것을 말한다. 호이스팅 세부 개념 자바스크립트 함수는 실행되기 전에 함수 안에 필요한 변수 값들을 모두 모아서 유효범위의 최상단에 선언한다. 1. 자바스크립트 Parser가 함수 실행 전 해당 함수를 한 번 훑는다. 2. 함수 안에 존재하는 변수/ 함수선언에 대한 정보를 기억하고 있다가 실행한다. 3. 유효 범위: 함수 블록 {} 안에서 유효 함수 내에서 아래쪽에 존재하는 내용 중 필요한 값들을 끌어 올리는 것이다. 1. 실제 메모리에서는 변화가 없다. 호이스팅의 대상 var 변수 선언과 함수선언문에서만 호이스팅이 일어난다. -var 변수/함수의 선언만 위로 끌어 올려지며, 할당은 끌..
for in, for of, forEach()
for...in for in 반복문은 객체의 모든 열거가능한 속성들을 포함하여, 객체에서 문자열로 키가 지정된 모든 열거 가능한 속성에 대해 반복한다. for in 구문은 객체의 key 값에 접근할 수 있지만, value 값에 접근하는 방법은 제공하지 않는다. 객체의 반복을 위해 만들어졌기 때문에 배열의 반복을 위해선 추천되지 않는다. for(variable in object){ statement; } variable : 매번 반복마다 다른 속성이름(Value name)이 변수로 지정된다. object : 반복작업을 수행할 객체로 열거형 속성을 가지고 있는 객체. 예시 let obj = {//[Key],[Value]가 대입된 변수 a: 1, b: 2, c: 3 } for(let list in obj){/..
조건문 if() {
조건문 if() function system = program(a) { if ([비교식]){ // 조건1이 통과할 경우 문장(statement) } else if([비교식]) { // 조건2 조건1이 통과하지 않을경우 // 조건2가 통과할 경우 문장(statement) } else { // 모든 조건이 통과하지 않는 경우 문장(statement) } } 각 조건(else 제외) 에는 Boolean으로 결과가 나오는 비교문이 들어간다. 조건 if안의 조건식이 참일 경우 if혹은 else if문을 실행한다. if 혹은 else if 가 거짓일 때, else의 문장을 실행한다. if는 중첩으로 사용 가능하며, else if는 갯수 제한이 없다. 각 조건문에는 비교연산자 및 논리 연산자가 들어간다. if(논리 ..
연산자
연산자 자바 스크립트의 연산자의 종류로는 비교 연산자, 산술 연산자, 논리 연산자 등 다양한 연산자들이 있다. 비교연산자 비교연산자는 피연산자들을 비교하고, 논리 값을 반환한다. 피연산자 들은 숫자, 문자열, 논리형, 객체를 사용할 수있다. 비교연산자 == 동일 != 상이 === 일치 !=== 불일치 보다 크다 = 보다 크거나 같다 ex) =>는 화살표를 나타냄 동일 연산자 1 == '1' //true null == indefined // true 0 == false // true 0 == undefined // false 부등 연산자 1 != '1' // false 1 != true // false 0 != false // false 일치 연산자 1 === 1 // true 1 === '1' // fa..
반복문 for, while
우선 for 문을 알아보면 아래와 같다. for() 반복문 for반복문 구조 for( [초기식] ; [조건식] ; [증감식]){ 반복문 (문장) } MDN에서 설명하는 동작 방식은 대충 이렇다. 초기식이 존재하면 최초로 실행되며, 변수로 선언 할수 있다. 조건식은 조건이 참이면 실행하고, 거짓이면 for문이 종결된다. 반복문을 실행한다. 증감문이 실행되고, 다시 2번부터 시작한다. 이 내용을 조금더 자세히 보면 var a = 0; for(let i = 0; i
Math 메소드, 문자열
Number() Number 객체는 Number() 함수를 이용해 문자열을 숫자로 바꿔주는 역할을 한다. let num = '2020' console.log(Number(num)) // 2020 let num = '2020년도' console.log(Number(num)) // NaN 하지만, 문자열 내에 숫자와 문자를 같이 쓰게 되면 NaN 을 결과로 출력한다. 즉, Number는 숫자 원시 값을 위한 객체입니다. 모든 원시 값은 불변하며, 문자열과 숫자를 혼용할 경우 NaN을 출력하게 된다. ParseInt() parseInt() 함수는 문자열 인자를 구문분석하여 특정 진수의 정수를 반환한다. let num = '2020' console.log(parseInt(num)) // 2020 let num ..