본문 바로가기

WEB/JavaScript

(4)
[JavaScript] 자바스크립트 연산, 반복문 🌈 String concatenation //String concatenation console.log('my' + 'cat'); // my cat console.log('1' + 2); // 12 console.log(`string literals: 1 + 2 = ${ 1 + 2 }`); // string literals: 1 + 2 = 3 (백틱기호를 사용 ``) // string literals의 좋은점은 줄바꿈을 하거나 특수기호를 이용해도 그대로 출력된다 console.log(`string literals: 1 + 2 = '''' ${ 1 + 2 }`); // string literals: 1 + 2 = (줄바꿈) '''' (줄바꿈) 3 console.log('bom\'s house'); //중간..
[JavaScript] let , var , const / 데이터 타입 🌈 let ES6에 추가된 언어이다. 변수를 선언하지 않고 값을 할당할 시에는 에러가 난다. let은 블록 범위로 변수를 선언할 수 있다. Block scope : 괄호를 이용해서 코드를 블럭안에 작성하게 되면, 블럭 밖에서는 블럭안에 있는 내용들을 볼수 없다. ⇨ 콘솔로그를 이용해서 블럭 밖에서 접근하게 되면 아무값도 나오지 않는다. 반대로 블럭을 쓰지 않고 파일 안에다가 바로 정해서 쓰는 변수들 ⇨ global scope 라고 부른다. ✔ 이 글로벌한 아이들은 어느곳에서나 접근이 가능하다. ✔ 글로벌한 변수들은 어플리케이션이 실행되는 순간부터 끝날때까지 항상 메모리에 탑재되어 있기 때문에 최소한으로 쓰는 것이 좋다. ✔ 가능하면 class , if , function 등 필요한 부분에만 이렇게 정리해..
[JavaScript] 콘솔 출력 / use strict 🌈 자바스크립트 이용해서 Hello 출력하기! console.log('hello'); 🌈 [엄격모드] use strict 자바스크립트는 유연한 언어이므로, 굉장히 위험하다. 그렇기 때문에 개발자가 실수하기 쉬운 잘못된 문법들을 미리 알려준다고 생각하면 된다. strict mode는 ECMAScript5부터 적용되었다. strict 모드로 설정하는 방법은 코드 앞쪽에 'use strict'를 추가하는 것이다. 'use strict'; a = 6; 위의 코드를 실행하게 되면 콘솔창에 아래와 같은 오류가 찍히게 된다. 에러를 없애기 위해서는 아래 코드를 수행한다. 'use strict'; let = a; a = 6;
[JavaScript] script async와 defer의 차이점 🌈 로드 순서 : HTML 파싱 ⇨ 로드 순서 : 태그 끝까지 HTML 파싱 ⇨ 발견 ⇨ JS 다운 ⇨ JS 실행 장점: HTML 컨텐츠를 빠르게 본다. 단점: 의미있는 컨텐츠가 JS파일에 의존적이면 사용자가 기다려야 한다. 🌈 로드 순서 : HTML 파싱 ⇨ 발견 ⇨ 병렬로 JS 다운 명령 ⇨ 다시 HTML 파싱 ⇨ JS 다운 완료 ⇨ HTML 파싱 중단 ⇨ JS 실행 ⇨ 남은 HTML 파싱 장점: 다운이 병렬적으로 일어나기 때문에 다운받는 시간을 절약할 수 있다. 단점: JS가 HTML이 파싱이 되기도 전에 실행이 되기 때문에 JS와 관련된 HTML의 요소가 파싱되지 않아 정의되지 않았을 경우 페이지 로드의 위험이 있다. 여전히 사용자가 페이지를 보는데 시간이 오래 걸린다. 🌈 [가장 좋은 방법] 로..