[FE - ConnecTo] DAY28 TIL👩🏻‍💻

22.08.18 수업을 통해 공부한 내용들을 정리하였습니다 😊
피드백은 언제나 환영입니다! 🍊

상속에 대한 발표 진행 (me)

상속이라는 단어가 맞나..???

클래스에서 extends라고 하고 inheritant(상속)라고 안하는 이유가 뭘까? 🤔

이게, 상속보다는 확장의 개념이다.

아버지가 가지고 있는걸 더 늘린다는 개념.

Parent가 3개 갖고있고 자식이 1개 갖고있는데 extends하면 4개로 확장이 되는 그런 느낌임.

그래서, 상속이라는 표현 보다는 확장이라는 것이 조금 더 와닿더라..!

---

객체 리터럴의 object 함수는 생성자 함수가 만든 것인가..?

객체 리터럴은 Object 생성자 함수가 만들지 않았고, 추상연산이 만듬

const obj = {} 의 부모는 추상연산 OrdinaryObjectCreate임.

그런데, 생성자함수랑은 왜 연결되나?

생성자 함수와 프로토타입은 항상 쌍으로 존재하기 때문임.

그렇다면,, 함수 객체가 function 생성자 함수를 만드는가..?

함수 리터럴을 만든 존재도, Function 생성자 함수가 아니지만 생성자 함수랑 연결됨. 그래서 프로토타입 직접 상속은 예제 19-55가 best 예제임.

언제나 함수보다는 표현식이 더 쉬운데, 그 이유가

함수는 이름 알아야되지, 뭘 줘야하는지 등등 여러가지를 알아야하는데, 표현식은 표현만 알면 되기 때문임.

---

• Array.prototype.length

일반적으로 배열마다 길이갖고 있다 생각하지만 프로토타입에 있음.

ex

• Array.prototype.at() - 배열.at으로 쓴다
• Array.from() - 정적 메소드.. 배열을 만드는 것이다 등등

---

for…in 문?

for…in 문은 안티패턴에 속하기 때문에, 사용하지 않는 것을 권장.

enumerable 때문에 헷갈리고, 자신에 속한 프로퍼티만 열거하려면 if문으로 hasOwnProperty 확인해야하고 번거로움.

Object.keys를 써라. for…in문보다 깔끔하고 좋음.

308페이지 for in문이 순회한다고 했는데,

객체에는 순회에 의미가 없지만, 모던한 자바스크립트 엔진은 순서를 맞춰서 나옴. 근데 ECMA정식표준이 아니라 브라우저 회사마다 다를 수 있어서 순회라고 하기는 그렇고, 원래 알던대로 순서에 의미가 없다고 생각하면됨.

---

Strict mode 관련

strict mode 사용하지 말고, ESLint를 사용하라는 의미임!

추가 내일까지 ESLint 설치하기! + Prettier도 함께 설치하기!

→ 완료!!!✌🏻

---

암묵적 전역

(function () {
	'use strict';

	x = 1;
	console.log(x);
}());

위의 코드에서 x = 1; 이 선언 없이 할당한 것 처럼 보이지만 아님.

저 앞에 window.x = 1;가 있기 때문에 프로퍼티 추가라고 보면 됨.

ESLint 설치하면 저런 것들 발견하기 쉬움!!! 😊

---

빌트인 객체

표준 빌트인 객체는 자바스크립트 엔진이 만든 것이고, ECMAScript 사양임.

호스트 객체는 자바스크립트 실행 환경(브라우저 또는 노드)가 만든 것이고, 콘솔 같은 것은 브라우저나 node 다 있지만 이름만 같고 구현은 다름.

그 다음에 우리가 만드는게 사용자 정의 객체임.

빌트인 전역 함수도 사실은 window.~~ 인데, 엄청 옛날에 처음에 나온 것들임.

isFinite, isNaN 이런 아이들은 안쓰는게 좋음.

왜냐? → 암묵적인 형변환을 하기 때문에 의도한대로 나오지 않을 수 있기 때문임. 그렇다면, 형변환을 안 해주는 것을 써야되는데, 예를들면 새로 나온 Number.isNaN 같은 것을 써야함.

encodeURI 가 뭘까..?

velog 주소에 한글이 나와 있는 주소를 복붙하면, 이상한 문자들 나오는데.. 이건 왜 이럴까?

URI는 랜선을 타고 왔다갔다하는데, 한글이 아닌 ASCII Code만 가능함. ASCII Code는 한글로 표현할 수 없어서, 글자가 깨지기 때문에, 유니코드 비슷한 것으로 강제 인코딩해주게 되는데, 이것이랑 관련된 것이 encodeURI임.

---

원시값과 래퍼객체

1.toFixed();

// 점 뒤에는 숫자가 와야 할 것 같은데,, SyntaxError가 생김.

이는 parsing 할 때 문법이 맞지 않아서 오류가 나는 것임.

이를 방지하기 위해서는 아래와 같이 작성하면 됨.

(1).toFixed();
1..toFixed();

// 여기서 .으로 내부적으로 래퍼 객체를 만드는 것을 알 수 있다.