Javascript : 2월 11일

1. inline_script

  console.log("Hello, Inline JavaScript!");

 

 console이라는 객체에 log라는 method가 있는거임 인자로 string을 보냄

 

3. variables_value_change

- const로 선언되어 있어도 객체나 배열, 참조형 데이터 타입인 경우 값은 변환할 수 있음

- var와 let, const는 scope가 다름

 

5. variables_declaration_only

변수 설정할 때 초기값 설정 안 해도 괜찮음 기본적으로 undefined가 저장되어있음

 

8. datatype_string

String - JavaScript | MDN

MDN 홈페이지 참고해서 메서드 사용

 

11. datatype_dynamic_typing

자바스크립트에서 알아서 문자열 숫자로 변환해서 계산해주는 경우 있음 → 이런게 오히려 혼란스러우니까 타입스크립트가 나온거임 

 

12. datatype_symbol

변수를 객체의 key로 만들 수 있다. [MY_KEY] 대괄호 작성 필요

symbol이 담겨있는 변수가 없으면 객체 안의 값에 access할 수 없음

 

13. datatype_symbol_for

전역적으로 사용하기 위한 symbol

똑같은 key를 사용한 symbol은 동일하게 취급

 

17. control_flow_while

- for문은 끝이 정해져 있는 경우, while문은 언제 끝날지 모르는 경우 쓴다.

- 끝을 정해놓는 게 좋음. 무한 반복 실행을 막기 위해서.

 

21. array_methods

- 함수에선 입력값과 반환값을 생각하는게 가장 중요

- functionarrayIndexOf(arr,val) { } → ()안에 순서는 중요하지만 이름은 내 마음대로 

- for문에서 break → 즉시 for문 중단, function문에서 return → 즉시 function 중단

 

25. functions_basics

- 중괄호를 쓴 경우에는 꼭 return을 써줘야함. 

- 자바스크립트에서는 class가 아니라 prototype이라는 개념이 존재

- 자바스크립트에서는 함수에 new를 붙이면 instance가 된다.

 

26. function_parameters

- fetchData ( (result) => { console.log(result); } ); → 익명 함수  

- 요즘엔 promise보다 async, await를 더 많이 쓴다. (같은 원리지만, 사용하는 방법이 다름)

- async함수는 프로미스 객체임.

mdn

 

async/await

- setTimeout : callback 함수

- callback이 실행되면 resolve()라는 promise를 가짐

- 이걸 하려면 new Promise로 객체를 만들어줘야함.

- 클로저 개념이 응용된 것

 

10차시 DOM (Document Object Model)

- html 태그들을 오브젝트로 만들어서 관리함. body안에 있는 요소들을 자바스크립트 오브젝트로 만들어서 관리.

- document.body;로 작성하면, body요소에 접근가능

- document.documentElement; html요소에 접근가능

- 웹 브라우저에서 자바스크립트 작동하는 이유는 document라는 변수가 이미 작성되어있어서 그 객체가 반환되는거임.

 

<button onclick ="~~~">뒤로가기</button>

- button : element 

- onclick = " " : attribute

- 뒤로 가기 : text 

 

 

- classList의 add와 toggle의 차이

클래스 메서드	동작 방식	이미 클래스가 있을 때	클래스가 없을 때
add()	무조건 추가	그대로 유지	클래스 추가
toggle()	있으면 제거, 없으면 추가	클래스 제거	클래스 추가