[면접준비] 기술 면접 기초 3일차

var, let, const의 차이에 대해 알려주세요.

var는 ES5부터 사용되던 변수 선언 키워드로 변수의 범위는 함수 스코프를 가집니다.

(함수 스코프란, 변수가 선언된 함수 내에서만 유효하다는 것을 의미)

또한 같은 범위 내에서라면 변수는 재선언(중복선언)이 되며 업데이트될 수 있습니다.

 

호이스팅이라는 개념을 가지고 있어 선언 전에 변수를 참조해도 에러가 발생하지 않지만 값이 undfined로 초기화됩니다.

(호이스팅이란, 변수 선언이 해당 스코프의 최상단으로 끌어올려지는 것)

 

 

let과 const는 은 ES6에서 도입된 변수 선언 키워드로 var와 다르게 블록 스코프를 가지고 있어 블록 내에서 선언된 변수는 그 블록 내에서만 유효합니다.

 

let은 선언된 해당 범위 내에서 업데이트가 될 수 있지만, var와 달리 let 변수는 범위 내에서 재선언이 불가능합니다.
그러나 동일한 변수가 다른 범위 내에서 정의되다면 에러가 발생하지 않습니다.

 

const는 업데이트하거나 재선언할 수 없습니다. 단 const 개체는 업데이트할 수 없지만, 개체의 '속성'은 업데이트할 수 있습니다

 

(오류가 없는 이유는 서로 다른 범위를 가지면 다른 변수로 취급되기 때문입니다. let을 사용하는 경우라면, 변수가 범위 내에서만 존재하기 때문에 이전에 이미 사용한 적이 있는 변수 명에 대해서 더 이상 신경쓰지 않아도 되며, 범위 내에서 동일한 변수를 두 번 이상 선언할 수 없기 때문에 앞서 설명한 var의 문제가 발생하지 않습니다.)

 

var와 마찬가지로 let 과 const 변수도 호이스팅이 발생하여 선언이 맨 위로 끌어올려지지만 var와 다르게 let , const의키워드는 초기화 되지 않으며 선언 이전에 let, const 변수를 사용하려고하면 Reference Error(참조 오류)가 발생합니다.

(var는 undefined 됨)

 

var는 재선언이 가능한 변수

let은 재선언은 불가능하지만 재할당은 가능합니다. const는 재선언, 재할당이 불가능합니다.

var은 선언과 동시에 초기화되어 메모리에 할당됩니다. 반면 let과 const는 선언과 초기화가 따로 이루어집니다. 자바스크립트 엔진은 호이스팅을 통해 런타임 이전에 선언이 이루어집니다. let과 const 변수의 경우 존재는 하지만 초기화되지 않았기 때문에 해당 변수를 접근하면 참조 에러가 발생합니다.

 

총정리

• var 선언은 전역 범위 또는 함수 범위이며, let과 const는 블록 범위입니다.
• var 변수는 범위 내에서 업데이트 및 재선언할 수 있다. let 변수는 업데이트할 수 있지만, 재선언은 할 수 없다. const 변수는 업데이트와 재선언 둘 다 불가능합니다.
• 세 가지 모두 최상위로 호이스팅된다. 하지만 var 변수만 undefined(정의되지 않음)으로 초기화되고 let과 const 변수는 초기화되지 않습니다.
• var와 let은 초기화하지 않은 상태에서 선언할 수 있지만, const는 선언 중에 초기화해야합니다.

---

Async/Await와 Promise의 차이에 대해 설명해주세요.

자바스크립트에서 비동기 작업을 다루는데 사용되는 중요한 개념입니다.

 

Async/Await:

• Async/Await는 ES8(ES2017)에서 도입된 Promise를 더 쉽게 사용하기 위한 문법입니다.
• Async 함수는 항상 Promise를 반환합니다.
• Async 함수 내부에서 await 키워드를 사용하여 Promise가 완료될 때까지 기다립니다.
• 코드가 동기식처럼 보이도록 해줍니다. 즉, 비동기 코드를 작성하는 것이 훨씬 간단하고 가독성이 높아집니다.
• try...catch 블록을 사용하여 에러를 처리할 수 있습니다.

Promise:

• Promise는 ES6(ES2015)에서 도입된 비동기 작업을 다루기 위한 객체입니다.
• 비동기 작업이 완료되었을 때 또는 실패했을 때 결과를 나타냅니다.
• Promise는 세 가지 상태를 가집니다: pending (대기 중), fulfilled (이행됨), rejected (거부됨).
• 비동기 작업을 처리할 때 then()과 catch()를 사용하여 성공 시와 실패 시의 콜백 함수를 등록할 수 있습니다.

차이점:

• Promise는 비동기 작업의 상태를 다루는 객체이며, then()과 catch()를 사용하여 처리합니다.
• Async/Await는 Promise를 더 쉽게 사용하기 위한 문법으로, Async 함수 내부에서 await 키워드를 사용하여 비동기 작업의 결과를 기다립니다.
• Async/Await를 사용하면 코드가 동기식처럼 보이도록 해주며, try...catch 블록을 사용하여 에러를 처리할 수 있습니다.
• Async/Await는 주로 Promise보다 더 간결하고 가독성이 높은 코드를 작성할 수 있도록 도와줍니다.

따라서, 비동기 작업을 처리할 때 Promise를 직접 사용하거나, 더 간결하고 가독성이 좋은 코드를 작성하기 위해 Async/Await를 사용할 수 있습니다.

 

---

Arrow Function 이란 무엇인지 설명해주세요.

Arrow Function(화살표 함수)은 ES6(ES2015)에서 도입된 함수 표현식의 새로운 문법입니다. 기존의 함수 선언식과 함수 표현식과 다르게  함수의 선언과 반환 값을 한 줄로 간단하게 표현할 수 있어 더 간결하고 간편하게 함수를 작성할 수 있습니다.