오늘의 느낀점
진짜 내용이 많고 너무 어렵다. 다른 레이서들에 비해서 기초적인 개념들을 모르는 것이 너무 많다.
따라가려면 빠듯하다. 뒤쳐지고 싶지 않다. 열심히 찾아보고 스스로 학습하고 복습하고 익숙해지자. 시간 투자만이 답이라고 생각한다.
절망은 잠깐만 하고 공부하자. 어쩌겠어~! 그래도 해야지! 이전에 배운 것 + 추가로 배운 것 간단 복습
- HTML과 CSS는 새 환경으로 기능이 추가되고 있지만, 하위 버전 지원을 위해 원래 기능이 거의 사라지지 않음. 즉 완전한 플랫폼이라고 가정하지 말고 추가되는 과정에 대한 의도를 생각해보자.
- CSS에 컨테이너 쿼리라는 것이 추가됨.
- Git merge vs rebase의 차이
- 요즘 쓰는건지 안쓰는건지나 새로운 기술이 나왔는지는 어떻게 알아보나요?
undefined vs null
- Undefined : 값이 선언되지 않은 상태. 할당되지 않은 상태 즉, 쓰긴 쓸건데 값을 넣지 않은 것임.
- Null : 값이 비어있음. 의도적으로 빈 값을 설정.. 다 썼거나, 없는 것.
object / array
- object
- array
- prototype이 붙은 게 있고 안붙은게 잇음
- 프로토타입은 직접 만든 배열에 붙여서 쓸 수 있음 (가져옴)
- 프로토타입이 없는 것은 직접 만든 배열에 붙일 수 없으며 함수 뒤에 써야함.
자바스크립트는 동적 타입 언어
- 동적타입 언어 : 동적 타입 언어의 자료형은 컴파일 시 자료형을 정하는 것이 아니고 실행 시에 결정
- 자바스크립트, 루비, 파이선 - 정적 타입 언어 : '타입' 즉 자료형을 컴파일 시에 결정하는 것 입니다.
- 자바, C, C# , C++
Primitive type(원시데이터) vs Reference
- 원시데이터 : immutable
- Reference : mutable
- 프라이밋티브 타입은 값을 쓰고, 옵젝트 타입은 참조를 쓰고.. 왜?
- 추측 : 객체와 배열은 무한정 커질 수 있어서 프라이미티브 타입처럼 매번 복사한다치면 비효율적임. 프라이미티브 타입은 보통은 값이 작기때문에, 참조하는 것보다 복사하는 것이 빠를 수 있음.
- 그러나 사실은..? 성능에 의한 이유라기 보다는 문자열은 매일 쓰는 것으로 객체나 배열 다루듯이 성능을 위해 옵젝트 타입으로 넣게되면 불편함... 성능상으로 희생하는 것도 있는데 사용하기 어려워짐
== vs ===
- == 쓰지말자. ===만 쓰자.
var let const
- var : 업데이트 O , 재선언 O , 함수 스코프
- let : 업데이트 O, 재선언 X , 블럭 스코프
- const : 업데이트 X, 재선언 X , 블럭 스코프 > 식별자에 재할당은 불가능하지만, const 객체라면 객체는 mutable 타입이라 프로퍼티 변경은 가능. 즉 문지기가 문으로는 못가게 하는데 창문으로 가서 바꾸는거는 신경 안씀 ㅋ
호이스팅
- 코드를 실행하기 전에 변수를 모두 사전 등록해두는 것
- let이랑 const가 호이스팅이 안되는 것처럼 보이지만, 사실 호이스팅은 일어나긴 하지만 기능상 추가된 것으로 인해 사용 자체가 막히는 것임.
변수 쉐도잉
var a = 10;
var a = 20;
{
let a = 20;
}- 쉐도잉은 같은 레벨에서도 발생하고, 다른 레벨에서도 발생함.
- let과 const의 특성에서 발현되는 내용.
함수 선언문 / 함수 표현식
- 함수 선언문은 호이스팅 되나, 함수 표현식은 호이스팅 되지 않음.
- 함수 선언문으로 정의한 함수와 함수 표현식으로 정의한 함수의 생성 시점이 다르기 때문임.
Local scope
- 안에서는 밖을 볼 수 있지만, 밖에서는 안이 안보임 (썬팅처럼)
화살표함수 (Arrow Function)
- 화살표 함수는 표현만 간략한 것이 아니라, 내부 동작도 기존의 함수보다 간략함.
1) 함수 정의
- 화살표 함수는 함수 선언문으로 정의할 수 없고 함수 표현식으로 정의해야 한다.
2) 매개변수 선언
const arrow = (x,y) => {...}; // 매개변수가 여러개인 경우 소괄호 () 안에 매개변수 선언
const arrow = x => {...}; // 매개변수가 1개인 경우 소괄호 생략 가능
const arrow = () => {...}; // 매개변수가 없는 경우 소괄호 () 생략 불가능3) 함수 몸체 정의
- 함수 몸체가 하나의 문으로 구성된다면 중괄호 생략 가능. 여러개의 문으로 구성된다면 중괄호 생략 불가함.
const power = x => x**2;
power(2); // 4
//위 표현은 다음과 동일하다.
const power = x => {retrun x **2;};
- 그러나 표현식이 아닌 문은 중괄호가 꼭 필요하다.
const arrow = () => const x = 1; //syntaxError : Unexpected token 'const'
const arrow = () => {return const x = 1;};
// 함수 몸체가 하나의 문으로 구성된다 해도 함수 몸체의 문이 표현식이 아닌 문이라면 중괄호를 생략할 수 없다. - 객체 리터럴은 소괄호로 감싸주거나, 리턴을 붙이고 중괄호로 다시 감싸기
const create = (id, content) => ({id, content});
const create = (id, content) => {retrun {id, content}};클로저의 개념
- 클로저의 개념
- 내부 함수에서 외부의 값을 참조할때, 외부 변수 값이 갑자기 변경되면 알아차리기 힘듦.. 마치 독 같은 존재.
for in , for of , for eaach
const arr = [바나나,사과,귤]
// for of
for (const 요소 of object){
console.log(요소)
//바나나 사과 귤
}
// for in
for (const 인덱스 in object){
console.log(인덱스, 배열[인덱스])
// 0 바나나 1 사과 2 귤
}
for//forEach 오직 배열/맵/셋에만 사용 가능.
//forEach() 메서드는 주어진 함수를 배열 요소 각각에 대해 실행합니다.
const items = ['item1', 'item2', 'item3'];
const copy = [];
// 이전
for (let i=0; i<items.length; i++) {
copy.push(items[i]);
}
// 이후
items.forEach(function(item){
copy.push(item);
});
filter / map / set
-> 내일 정리하기..
백엔드개발자