[TDL] 04/18 Today's-Done-List

- JS 기본 문법

• NaN : Not a Number로 숫자가 아니라는 뜻. 오류는 아니고 Js에서 인정한 문법이다.
  • 숫자로 읽어낼 수 없다.
  • 잘못된 계산 결과식
  • 정의할 수 없는 결과식
  • 문자열이 포함된 계산식 (덧셈 제외)

// 느슨한 검사
isNaN(undefined);          // true
isNaN({});                 // true
isNaN('문자열');           // true

// 엄격한 검사 ES2015+
Number.isNaN(undefined);   // false
Number.isNaN({});          // false
Number.isNaN('문자열');    // false

 

• Infinity : 말 그대로 무한대를 나타내는 숫자 값. 지수 1023까지만 허용되고, 그 이상은 Infinity로 나타남.
  isFinite으로 확인 가능.

// pow는 거듭제곱 구하는 함수
Math.pow(2, 1024)        // Infinity
7 / 0                    // Infinity

// Infinity 이면 false
isFinite(Infinity)       // false
isFinite(NaN)            // false
isFinite(7 / 0)          // false
isFinite(7 / 1)          // true
isFinite(19)             // true

 

• BigInt : Number 원시 값이 안정적으로 나타낼 수 있는 최대치인 2^53 - 1보다 큰 정수를 표현할 수 있는 내장 객체
  • JS에서 다루기 어려운 큰 숫자들을 다룰 수 있다.
  • BigInt는 Number와 일치하지 않지만 동등하다.
  • BigInt대신 숫자 마지막에 n을 간단히 사용할 수 있다.
  • 최신 문법으로 IE에서는 지원하지 않음.

console.log(123123123123123123123123)          // 1.2312312312312312e+23
console.log(123123123123123123123123n)         // 123123123123123123123123n
console.log(BigInt(123123123123123123123123))  // 123123123123123117883392n

 

• Number.MAX_SAFE_INTEGER : JS에서 안전한 최대 정수를 나타낸다. 2^53 - 1  (더 큰 경우 BigInt)

// MAX_SAFE_INTEGER의 반환 값

Number.MAX_SAFE_INTEGER; // 9007199254740991

 

• Number.MIN_SAFE_INTEGER : JS에서 안전한 최대 정수를 나타낸다. - (2^53 - 1)  (더 작은 경우 BigInt)

// MIN_SAFE_INTEGER의 반환 값

Number.MIN_SAFE_INTEGER // -9007199254740991

---

- JavaScript to-do-list

아직 js문법들에 완전히 익숙하지 않아서 조금 더 숙달시켜야 할 것 같다.
js에서 dom으로 html을 다루는 방법들이 너무 헷갈려ㅠ

;(function () {
  'use strict'
  
  const TodoList함수 = (item) => {
    const { id, content } = item    // json으로 받아올 데이터
    const $todoItem = document.createElement('div')
    $todoItem.classList.add('item')
    $todoItem.dataset.id = id
    $todoItem.innerHTML = ``
    
  const render데이터함수 = () => {
  	$todos.innerHTML = ''
    todos.forEach((item) => {
    	const todoElement = TodoList함수(item)
        $todos.appendChild(todoElement)
  }
  
  const get데이터함수 = () => {
  fetch(URL_API)
  .then((res) => res.json())
  .then((todos) => {render데이터함수(todos)})
  }
  
  const init = () => {
   window.addEventListener('DOMContentLoaded', () => {
      get데이터함수()
    })
  }
  
  init()
 })()

---

17:50 오후 회고 스터디 (만족도 : 5)
오후에 집중이 너무 안됐다...
그래서 차라리 밥을 빨리 먹고 조금 쉰다음 공부하려 했는데 밥 먹으니까 졸려서 좀 잤더니 평소 시간이랑 비슷하네^-^

---

- 자료구조 / 알고리즘 (Js ver.) 강의

오늘로 기본, 종합문제 끝내고 이제까지 문제들을 풀며 조금 버벅거렸던 문법들을 다시 정리해보는 시간을 가졌다.

• String.prototype.slice()
  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/slice
• Date.prototype.getDay()
  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date/getDay
• Set
  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Set
• Math.max()
  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/max
• Function.prototype.apply()
  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/apply
• String.prototype.includes()
  https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/includes

---

22:50 저녁 회고 스터디 (만족도 : 6)
오늘 하루 종일 집중이 안됐다.. 정신 차려!

---

[ 출처, 참고 : 제로베이스 프런트엔드 스쿨 ]