1. 비동기란 무엇이냐? 한 번 비동기는 영원한 비동기이다. async, await을 붙여 동기로 만들었다는 말은 말도 안된다는 소리다. 강사님은 말한다. 비동기를 동기로 바꾸려는 노력을 아예~ 하지마세요. 그간 했던 프로젝트가 떠오른다... 2. 비동기는 백그라운드를 거친다. 비동기이면 백그라운드를 한 번 거친다. 백그라운드는 OS 혹은 C++ 엔진 이라고 생각하면 된다. 호출 스택에서 비동기 함수가 실행되면 백그라운드에 들어간다. 백그라운드에 들어가는 순간 JavaScripts에서는 되지 않던 동시 실행이 가능해지는 영역이라고 생각하면 된다. 백그라운드에 들어가는 요소들 setTimeout(비동기 함수)의 타이머 Promise nextTick 네트워크 요청(ajax) 이벤트 리스너(click 등) 3..
1. Promise란? Promise는 실행이 됐는데, 결과값을 나중에 쓸 수 있는 것이다. 콜백은 무조건 비동기가 아니다. 콜백은 동기일 수도 있고, 비동기 일 수도 있다. 비동기 콜백 종류가 비동기인 것이지 콜백이라고 해서 무조건 비동기가 아니라는 의미이다. 2. setTimeout의 단점 가장 대표적인 비동기 콜백은 setTimeout이다. 아래 코드의 단점은 어떤 조건이 만족되면 바로 ()=>{} 이 함수가 실행된다는 것이다. 즉, 함수 부분을 분리할 수 없다는 단점이 있다. setTimeout(()=>{ console.log('a'); }, 1000); 3. Promise의 장점 아래 코드는 Promise를 선언하는 기본 구조이다. new Promise((resolve, reject)=>{ })..
1. 기본 window를 의미함 console.log(this); 과거 this를 출력하면 js에서는 window 전역 객체가 호출되고, node에서는 global 전역 객체가 호출되었다. 하지만 이렇게 쓰일 경우 js와 node에 따라 분기처리를 해줘야하는 불편함이 있었다. 그래서 최근에는 globalThis로 통합이 되었다. 2. strict 모드 function a(){ 'use strict' console.log(this); } a(); 기존 this를 쓰면 globalThis가 도출된다고 했지만 'use strict'를 함께 써주면 this는 undefined가 된다. 3. this가 변경될 때 this가 변경되는 3가지 경우가 있다. 1) 객체 안에 있을 때 const obj = { name:..
1. 함수는 일급 객체 자바스크립트에서 함수는 값처럼 사용이 가능하다. 변수에 함수를 넣을 수 있고, 매개변수로도 넘길 수 있다. 배열에도 함수가 들어간다. 메서드(함수)가 객체의 프로퍼티(속성)로도 설정이 가능하다. 매개변수의 개수가 일치하지 않아도 호출 가능하다. 엄격하지 않은 것이다. 자바스크립트의 함수는 일급 객체라고 부른다. 2. 함수 선언 2가지 방법 //함수 선언 2가지 유형 //1. 함수 표현식 const add = (a,b) => a+b; //2. 함수 선언식 function calculator(func, a, b){ return func(a,b); } 함수 선언식은 function을 쓰는데, 이를 통해 함수 호이스팅이 가능하다. 함수 호이스팅은 첫 번째로 소스코드 평가 단계를 거친다. ..
대략적으로 JS가 어떻게 쓰이는지 확인해보고싶어서 드림코딩 엘리님의 프로젝트를 따라해보았다. 나중에 헤더만들 때 유용하게 쓰려고 기록해두려고 한다 ! 1. 사이트 정리 먼저, 이 프로젝트를 할 때 필요한 사이트들을 정리해보도록 하겠다. 1. Font Awesome https://fontawesome.com/ Font Awesome The world’s most popular and easiest to use icon set just got an upgrade. More icons. More styles. More Options. fontawesome.com 사용법은 start for free를 눌러 메일을 통해 인증을 하자. 인증을 완료하면 자신의 코드가 포함되어 있는 코드를 얻을 수 있다. ..
오늘은 드림코딩 엘리 개발자님의 4번째 강의를 들었습니다. operator의 관한 내용 지금부터 정리해보도록 하겠습니다! 1. string concatenation console.log('my'+' cat'); console.log('1'+2); console.log(`string literals: 1 + 2 = ${1+2}`); //특수문자열도 비슷함 console.log('san\nh\ta'); 1-1. string + string = string 1-2. string + number = string 1-3. string과 number 계산을 같이 쓰고 싶은 땐, 백팁을 사용한다(``) number 계산은 ${}을 이용한다. 1-4. c언어와 비슷한 특수 문자열 표시를 가지고 있음 \n = 줄 바꾸기..
오늘도 엘리슨생님의 3강 강의를 듣고 왔습니다! https://www.youtube.com/watch?list=PLv2d7VI9OotTVOL4QmPfvJWPJvkmv6h-2&v=OCCpGh4ujb8&feature=emb_title 한번 정주행 완료하고 다시 복습하는 마음으로 블로그에 공부 내용을 정리해보겠습니다! 1. let vs var let은 ES6에서 추가되었기 때문에 비교적 최근에 추가되었다. ES6는 메이저 브라우저에서 모두지원된다.(단, 인터넷 익스플로어는 지원 안됨) 그 전까지는 var을 썼었다. but, 쓰면 안됨 그 이유로는 선언도 하기 전에 값 할당 할 수 있고, 출력도 undefined로 가능하기 때문이다. 다음의 코드를 확인해보자. a=10; console.log(..
오늘 공부한 영상! 엘리슨생님과 함께하는 js!!! 저번 포스팅에서도 공부했지만 너무 오래지나서 다시해본다 ㅎ https://youtu.be/tJieVCgGzhs 1. 사용법 자바스크립트를 HTML에 추가하는 코드는 이렇다. 1) LIVE SERVER가 설치되어 있다면 빨간색 부분을 눌러서 실행 가능! 2) LIVE SEVER가 없다면 노란색 부분을 눌러 실행가능! 2. console.log("HELLO") console.log("HELLO") 이런식으로 JS를 작성하였다면 실행하였을 때 F12 혹은 Ctrl+Shift+i 버튼을 눌러 오른쪽과 같은 창을 볼 수 있다. 잘나오는 모습 ^^! 이렇게 브라우저에서 실행도 가능하지만, node.js에는 자바스크립트 엔진이 있다...
