요약 정리는 못 참지 않을까요? (1)

⚡프로그래밍언어는 뭐라고 생각하시나요?

프로그래밍 언어란 사람과 컴퓨터(컴파일러,인터프리터) 모두가 이해할 수 있는 약속된 형태의 인공어입니다.
주로 프로그래밍언어는 구문(syntax)와 의미(semantics)의 조합으로 표현됩니다.

** 프로그래밍이란?
요구사항의 집합을 분석해 적절한 자료구조와 함수의 집합으로 변환한 후
그 흐름을 제어하는 것

 

---

⚡렌더링이란 뭔가요?

렌더링이란 HTML,CSS,Javascript로 작성된 문서를 해석하여 브라우저에 시각적으로 출력하는 것입니다.

때로는 서버에서 데이터를 HTML로 변환해서 브라우저에게 전달하는 과정
(SSR: Server Side Rendering)을 말하기도합니다.

 

---

⚡Ajax를 설명해주세요

Ajax는 자바스크립트를 이용해 서버와 브라우저가 비동기 방식으로 데이터를 교환할 수 있는 통신 기능입니다.

XMLHttpRequest라는 이름으로도 부릅니다.
이전에는 화면이 전환되면 웹페이지 전체를 처음부터 다시 렌더링 했지만
ajax의 등장으로 인해 서버로부터 필요한 데이터만 전송받아 변경할 부분만 다시 렌더링하는게 가능해졌습니다.

 

---

⚡자바스크립트를 설명해주세요

자바스크립트는 명령형, 함수형, 프로토타입 기반, 객체지향 프로그래밍을 지원하는
멀티 패러다임 프로그래밍 언어입니다.

상속,정보은닉을 위한 키워드는 없지만 프로토타입 기반의 객체지향 언어입니다. 

**브라우저 환경에서의 자바스크립트는 어째서 파일 시스템을 제공하지 않는 건가요?
만약 브라우저를 통해 다운로드되어 실행되는 자바스크립트가 사용자 컴퓨터의 로컬 파일을 삭제,수정,생성할 수 있다면 악성코드에 노출된것이나 다름없기때문에 보안상의 이유로 브라우저 환경의 자바스크립트는 파일 시스템을 제공하지 않습니다.

 

---

⚡웹크롤링이 뭔가요?

웹 크롤링은 서버에서 웹사이트의 콘텐츠를 수집하기 위해 HTML 문서를 가져온 다음
HTML 문서를 가공해서 필요한 데이터만 추출하는 것입니다.

 

---

⚡변수에 대해 설명해주세요

변수는 하나의 값을 저장하기 위해 확보한 메모리 공간 자체
또는 그 메모리 공간을 식별하기 위해 붙인 이름을 말합니다.

변수는 기억하고 싶은 값을 메모리에 저장하고 저장된 값을
재사용하기 위해 사용하는 매커니즘이라고 할 수 있습니다.

** 메모리란?
데이터를 저장할 수 있는 메모리 셀(memory cell)의 집합체입니다.
메모리셀 하나의 크기는 1바이트(8bit)이며 컴퓨터는 1 바이트 단위로 데이터를 저장,읽어들입니다.

 

---

⚡식별자가 뭔가용?

식별자는 어떤 값을 구별해서 식별할 수 있는 고유한 이름을 말합니다.

식별자는 값이 저장된 메모리 공간에 접근하기 위해
값이 저장된 메모리 주소를 기억 해야 합니다.
즉 식별자는 값을 기억하는 것이 아닌 값이 저장된 메모리 주소를 기억하며

자바스크립트에서는 선언(declaration)에 의해 식별자의 존재를 알립니다.

 

---

⚡변수 선언에 대해 설명해주세요

변수 선언이란 변수를 생성하는 것을 말합니다.

1. 값을 저장하기 위한 메모리 공간을 확보하고
2. 변수 이름과 확보된 메모리 공간의 주소를 연결해서 값을 저장할 수 있게 합니다.

변수 선언에 의해 확보된 메모리 공간은 확보가 해제되기 전까지는
누구도 확보된 메모리 공간을 사용할 수 없도록 보호되므로 안전합니다.

 

---

⚡가비지 콜렉터가 뭔가용?

가비지 콜렉터는 애플리케이션이 할당한 메모리 공간을 주기적으로 검사하여
더이상 사용되지 않는 메모리를 해제하는 기능을 말합니다.

** 더이상 사용되지 않는 메모리란?
어떤 식별자도 참조하지 않는 메모리 공간을 말합니다.
자바스크립트는 가비지콜렉터를 내장하고 있는 매니지드 언어로서 가비지 콜렉터를 통해
메모리 누수(memory leak)을 방지합니다.

따라서 자바스크립트는 매니지드 언어입니다.(managed language)

 

---

⚡메모리누수가 일어나는 상황에 대해 말해주세요

1. 클로저의 잘못된 사용
2. 의도치않게 생성된 전역 변수
3. 분리된 DOM 노드
4. 콘솔출력
5. 해제하지 않은 타이머

 

---

⚡값과 리터럴, 표현식에 대해 설명해주세용

값은 식(표현식)이 평가되어 생성된 결과를 말합니다.

리터럴은 사람이 이해할 수 있는 문자 또는 약속된 기호를 사용해
값을 생성하는 표기법을 말합니다.

표현식이란 값으로 평가될 수 있는 문을 말합니다.
표현식이 평가되면 새로운 값을 생성하거나 기존 값을 참조합니다.
리터럴도 표현식입니다.

 

---

⚡문에 대해 설명해주세용

문은 프로그램을 구성하는 기본 단위이자 최소 실행 단위입니다.
문의 집합으로 이뤄진 것이 프로그램이고 문을 작성하고 순서에 맞게 나열하는 것이 프로그래밍입니다.
문은 여러 토큰으로 구성됩니다.

**토큰이란?
문법적인 의미를 가지며 문법적으로 더이상 나눌 수 없는 코드의 기본 요소를 말합니다.

 

---

⚡표현식이 아닌 문이 존재할 수 있나요?

네.

표현식이 아닌 문은 값으로 평가될 수 없는 문을 말합니다.
표현식은 문의 일부일 수 있고 표현식 자체가 문이 될 수도 있습니다.

예를 들어서 변수 선언문은 값으로 평가될 수 없기 때문에 표현식이 아닌 문이고
할당문은 값으로 평가될 수 있기 때문에 표현식인 문입니다.

 

---

⚡자바스크립트가 제공하는 데이터 타입을 말해주세요

1. 숫자 (64비트 부동소수점 형식을 따름,모든 수를 실수로 처리함)
2. 문자열 (한글자당 2바이트(16비트)씩 차지함)
3. 불리언
4. undefined
5. null
6. symbol (절대 중복되지 않는 값)
7.객체타입

7을 제외한 나머지는 전부 원시타입입니다.

 

---

⚡데이터 타입은 왜 필요한가요?

데이터 타입에 따라 확보되는 메모리 공간의 크기를 다르게 설정하는 것이 효율적이기 때문입니다.

1. 값을 저장할 때 확보할 메모리 공간의 크기를 결정하기 위해
2. 값을 참조할 때 한번에 읽어 들여야 할 메모리 공간의 크기를 결정하기 위해
3. 메모리에서 읽어 들인 2진수를 어떻게 해석할지 결정하기 위해

 

---

⚡연산자에 대해 설명해주세요

연산자는 하나 이상의 표현식을 대상으로
산술, 할당, 비교 , 논리, 타입 , 지수 연산 등을 수행해 하나의 값을 만듭니다.

 

---

⚡제어문에 대해 설명해주세요

제어문은 조건에 따라 코드 블록을 실행하거나 반복 실행할 때 사용하는 문입니다.
제어문에는 블록문 , 조건문, 반복문, break문 , continue 문이 존재합니다.

 

---

⚡타입 변환에 대해 설명해주세요

타입 변환에는 명시적 타입 변환과 암묵적 타입 변환이 있습니다.

개발자가 의도적으로 값의 타입을 변환하는 것을 명시적 타입 변환
혹은 타입 캐스팅이라고 합니다.

개발자의 의도와 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되기도하는데
이것을 암묵적 타입 변환 혹은 타입 강제 변환이라고 합니다.

 

---

⚡0이나 ""이 객체로 평가될 때도 있나요?

네.

원시값에 점표기법으로 접근할 시 자바스크립트 엔진이 일시적으로 원시값을
연관된 객체로 변환해 주기 때문에 객체로 평가될 때도 있습니다.

이처럼 문자열, 숫자, 불리언 값과 같은 원시값에 대해 객체처럼 접근하면 생성되는 임시객체를
래퍼 객체(Wrapper Object)라고 합니다.  

 

---

⚡옵셔널 체이닝 연산자에 대해 설명해주세요

옵셔널 체이닝 연산자 ?.는 좌항의 피연산자가 null 또는 undefined인 경우
undefined를 반환하고 그렇지 않으면 우항의 프로퍼티 참조를 이어갑니다.

객체를 가리키기를 기대하는 변수가 null 또는 undefined가 아닌지 확인하고
프로퍼티를 참조할 때 유용합니다.

 

---

⚡객체에 대해 설명해주세요

객체 타입은 다양한 타입의 값을 하나의 단위로 구성한 복합적인 자료구조입니다.
또한 객체는 원시 값과 달리 변경 가능한 값입니다.
객체는 0개 이상의 프로퍼티로 구성된 집합이며 프로퍼티는 키와 값으로 구성됩니다.
또한 프로퍼티 값이 함수일 경우 일반 함수와 구분하기 위해 메서드라고 부릅니다.

**프로퍼티 : 객체의 상태를 나타내는 값(data)
**메서드 : 프로퍼티(상태 데이터)를 참조하고 조작할 수 있는 동작(behavior)

객체는 프로퍼티와 메서드를 모두 포함할 수 있기 때문에
상태와 동작을 하나의 단위로 구조화 할 수 있어 유용합니다.

 

---

⚡인스턴스가 뭔가요?

인스턴스는 클래스에 의해 생성되어 메모리에 저장된 실체를 말합니다.

객체지향 프로그래밍에서 객체는 클래스와 인스턴스를 포함한 개념입니다.
클래스는 인스턴스를 생성하기 위한 템플릿의 역할을 하고
인스턴스는 객체가 메모리에 저장되어 실제로 존재하는 것에 초점을 맞춘 용어입니다.

 

---

⚡자바스크립트에서 객체를 생성하는 방법들을 말해주세요

객체 리터럴 방식
Object 생성자 함수
생성자 함수
Object.creat 메서드
클래스(es6)
를 사용하여 객체를 생성할수 있습니다.

 

---

⚡원시값과 객체타입값의 차이는 무엇인가요?

1. 원시값은 변경이 불가능하지만 객체타입값은 변경할 수 있습니다.

2. 원시값을 변수에 할당하면 변수(확보된 메모리 공간)에는 실제 값이 저장되지만
객체를 변수에 할당하면 변수(확보된 메모리 공간)에는 참조 값이 저장됩니다.

3. 원시 값을 갖는 변수를 다른 변수에 할당하면 원본의 원시 값이 복사되어 전달됩니다.
이것을 값에 의한 전달이라고 합니다.
엄밀히말하면 값이 아니라 값이 담긴 메모리주소를 전달하는 것이지만
전달된 메모리 주소를 통해 메모리 공간에 접근하면 값을 참조할 수 있습니다.

결국 변수에 원시 값을 갖는 변수를 할당하면 두 변수의 원시 값은
서로 다른 메모리 공간에 저장된 별개의 값이 되어 서로 간섭할 수 없게됩니다.

반면 객체를 가리키는 변수를 다른 변수에 할당하면 원본의 참조 값이 복사되어 전달됩니다.
이를 참조에 의한 전달이라고 합니다.

 

---

⚡자바스크립트 객체의 관리 방식을 설명해주세요

자바스크립트 객체는 프로퍼티 키를 인덱스로 사용하는 해시 테이블이라고 생각할 수 있습니다.

클래스 기반 객체지향 언어들은 사전에 정의된 클래스를 기반으로 객체를 생성합니다
다만 자바스크립트는 클래스 없이 객체를 생성할 수 있고
객체가 생성된 이후라도 동적으로 프로퍼티와 메서드를 추가할 수 있습니다.

이는 편리하지만 성능 면에서는 생성과 프로퍼티 접근에 비용이 더 많이드는 비효율적인 방식입니다.
이를 보완하기 위해 자바스크립트 엔진에서는 프로퍼티 접근을 위해 동적 탐색 대신

히든 클래스 방식을 이용해 성능을 보장합니다.
히든 클래스 방식은 자바와 같이 고정된 객체 레이아웃과 유사하게 동작합니다.
(대충 동적프로퍼티 생성할때마다 새 클래스를 만들어서
동적프로퍼티 생성한것과 이전클래스껄 상속시키는 방식을 사용하는듯)

 

---

⚡원시값이 변경불가능하다면 우린 변수값을 어떻게 변경할수있나요?

변경 불가능 한 것은 변수가 아니라 값에 대한 진술이기 때문에
우리는 원시 값 자체를 변경할 수는 없지만 변수 값은 변경할 수 있습니다.

 

---

⚡얕은 복사와 깊은 복사에 대해 설명해주세요

객체를 프로퍼티 값으로 갖는 객체의 경우
얕은 복사는 한 단계까지만 복사하는 것을 말하고
깊은 복사는 객체에 중첩되어 있는 객체까지 모두 복사하는 것을 말합니다.

얕은 복사와 깊은 복사로 생성된 객체는 원본과는 다른 객체입니다.
즉 원본과 복사본은 참조 값이 다른 별개의 객체입니다.

하지만 얕은복사는 객체에 중첩되어있는 객체의 경우 참조 값을 복사하고
깊은 복사는 객체에 중첩되어있는 객체까지 모두 복사해서 원시 값처럼 완전한 복사본을 만든다는
차이가 있습니다.

 

---

⚡함수에 대해 설명해주세요

함수는 일련의 과정을 문으로 구현하고 코드 블록으로 감싸서 하나의 실행 단위로 정의한 것입니다.
함수 내부로 입력을 전달 받는 변수를 매개변수 입력을 인수 출력을 반환값이라 합니다.
자바스크립트의 함수는 객체 타입의 값이며 함수 리터럴로 생성할 수 있습니다.
다만 일반 객체는 호출할 수 없지만 함수는 호출 할 수 있으며
함수 객체만의 고유한 프로퍼티를 갖는다는 특징이 있습니다.

 

---

⚡함수를 정의하는 방식에 대해 설명해주세요

함수 선언문, 함수 표현식, function 생성자 함수, 화살표 함수 총 네가지 방식으로 정의할 수 있습니다.

함수 선언문은 함수 리터럴과 형태가 동일하지만 함수 리터럴은 함수 이름을 생략할 수 있고
함수 선언문은 함수 이름을 생략할 수 없다는 특징이 있습니다.
함수 선언문은 표현식이 아닌 문입니다.

** 함수 선언문을 실행했을 때 완료 값으로 undefined가 출력됩니다.
만약 표현식인 문이라면 undefined 대신 표현식이 평가되어 생성된 함수가 출력되어야합니다.

//함수선언문

function add(x,y) {
	return
}

//함수 표현식
let add = function(x,y) {
	return
}

// Function 생성자 함수
let add = new Function('x','y','return')

//화살표함수
let add = (x,y) => x + y

 

 

---

⚡함수 선언문에서 함수 이름을 외부에서도 식별자로 쓸 수 있는 이유는?

함수 리터럴의 구성요소 중 함수 이름은 함수 몸체 내에서만 참조할 수 있는 식별자입니다.

하지만 그럼에도 불구하고 식별자를 선언하지 않고 할당한 적도 없이
함수 이름을 외부에서도 식별자처럼 사용할 수 있는 이유는
자바스크립트 엔진이 암묵적으로 식별자를 생성해주기 때문입니다.

함수 객체를 가리키는 식별자가 없으면 생성된 함수 객체를 참조할 수 없으므로 호출할 수도 없기에
자바스크립트 엔진은 생성된 함수를 호출하기 위해 함수 이름과 동일한 이름의 식별자를
암묵적으로 생성하고 거기에 함수 객체를 할당해줍니다.

즉 결론적으로 자바스크립트 엔진은 함수 선언문을 함수 표현식으로 변환해준다고
생각을 할 수도 있겠지만~~~~!!!
선언문과 표현식이 정확히 동일하게 동작하지는 않습니다. 

---

⚡표현식 함수에 대해 설명해주세요

함수 선언문으로 정의한 함수는 함수 선언문 이전에 호출할 수 있지만
함수 표현식으로 정의한 함수는 함수 표현식 이전에 호출할 수 없습니다.

함수 선언문으로 정의한 함수와 함수 표현식으로 정의한 함수의 생성시점이 다르기 때문입니다.
함수선언문은 함수 호이스팅이 발생하며 코드의 선두로 끌어 올려진 것처럼 동작하지만
함수표현식으로 정의하면 변수 호이스팅이 발생합니다.
그렇기에 함수표현식 이전에 함수를 참조하면 undefined로 평가됩니다.


**함수 선언문은 런타임 이전에 이미 함수로 선언되어있지만
함수 표현식은 런타임 과정에서 할당문의 실행 이후에 함수가 되기 때문에
함수 표현식으로 정의된 함수는 반드시 함수 표현식 이후에 참조,호출 해야합니다.

함수선언문은 함수를 선언하고 호출해야한다는 당연한 규칙을 무시한다는 문제가 있습니다.

 

---

⚡Function 생성자 함수에 대해 설명해주세요

생성자 함수는 객체를 생성하는 함수를 말합니다.
생성자 함수로 생성한 함수의 문제점은 다음과 같습니다.

1. 클로저를 생성하지 않습니다.
2. 함수 선언문, 표현식으로 생성한 함수와 다르게 동작합니다.

 

---

⚡화살표 함수에 대해 설명해주세요

화살표 함수는 항상 익명 함수로 정의합니다.
화살표 함수는 내부 동작 또한 간략화되어 있다는 특징이 있습니다.

1. 생성자 함수로 사용할 수 없다.
2. this 바인딩 방식이 다르다.
3. 프로토타입 프로퍼티가 없다.
4. arguments 객체를 생성하지 않는다.

---

⚡순수 함수에 대해 설명해주세요

순수함수는 동일한 인수가 전달되면 언제나 동일한 값을 반환하는 함수입니다.
즉 순수 함수는 어떤 외부 상태에도 의존하지 않고 오직 매개변수를 통해
함수 내부로 전달된 인수에게만 의존해 값을 생성하고 반환합니다.

**외부 상태가 뭐임?
전역 변수, 서버 데이터, 파일, console, DOM 등이 있습니다.

**만약 함수 내부 상태에만 의존한다해도 그 내부 상태가
호출 될 때마다 변화하는 값이라면 순수함수가 아닙니다.


순수함수의 반대면 비순수함수인가요?
네.
비순수 함수는 함수의 외부 상태를 변경하는 부수 효과가 있습니다.
즉 비순수함수는 외부 상태에 의존하거나.
외부 상태를 변경하는 함수입니다. ex (console.log())