js quiz 4 (71~100)
·
🎨 프론트엔드 공부/JS & TS
📌71. 제네레이터 함수function* startGame() { const answer = yield 'Do you love JavaScript?'; if (answer !== 'Yes') { return "Oh wow... Guess we're done here"; } return 'JavaScript loves you back ❤️';}const game = startGame();console.log(game.next().value); // Do you love JavaScript?console.log(game.next("Yes").value); // JavaScript loves you back ❤️ - yield 의 값인 answer는 아직 정해지지 않은 상태로 함수가 멈추게 된다..
js quiz 3 (46~70)
·
🎨 프론트엔드 공부/JS & TS
📌46. 객체의 참조 저장let person = { name: 'Lydia' };const members = [person];person = null;console.log(members); // [ { name: 'Lydia' } ] 객체를 변수에 할당하면 값 자체가 아닌, 참조(메모리 주소)가 저장된다- members[0] 이 person과 같은 참조를 바라보고 있다가- person = null 할당되어 person의 참조가 바뀌어도- members[0] 이 애초에 바라보던 참조가 바뀌지 않는다 📌49. parseIntconst num = parseInt('7*6', 10); // 7 - 문자열의 첫 번째 유효한 10진수 숫자만 숫자로 변환된다- *은 유효한 숫자가 아니라서 7까지만 변환됨 54. ..
js quiz 2 (18~45)
·
🎨 프론트엔드 공부/JS & TS
19. JS typeof, rest parameterfunction getAge(...args) { console.log(typeof args);}getAge(21); // "object" ([21]) - rest parameter는 모든 인자를 배열에 담는다- JS에서 배열은 object 타입에 해당한다 20. "use strict"function getAge() { 'use strict'; age = 21; console.log(age); // ReferenceError}getAge(); 'use strict'- 전역 변수를 선언하지 않겠다고 명시하기 때문에 window.age = 21 불가능하므로 ReferenceError 발생- 굳이 코드 최상단에 위치할 필요 없다 📌21. session..
js quiz 1 (1~17)
·
🎨 프론트엔드 공부/JS & TS
1. var, let 변수 선언의 차이와 호이스팅function sayHi() { console.log(name); // undefined console.log(age); // ReferenceError var name = 'Lydia'; let age = 21;}sayHi(); var- var로 선언한 변수는 값을 초기화하기 전까지 undefined 값을 갖는다- 값을 초기화하기 전에 변수 접근 가능(호이스팅) let, const- let: 값을 초기화하기 전에 변수 접근 불가 (TDZ -> ReferenceError)- const: 변수 선언시 반드시 값을 할당해야 함 📌2. 반복문과 setTimeout 및 var, let 차이for (var i = 0; i console.log(i)..
[MacOS] 크롬 브라우저에서 그래픽 가속 사용 감지하기
·
🎨 프론트엔드 공부/JS & TS
MacOS 에서만 가능 (WinOS 에서는 그래픽 가속 꺼도 WebGL 기능 사용 가능) WebGL 1.0 렌더링 컨텍스트 만족시키는지 확인하는 코드function isWebGLSupported() { try { const canvas = document.createElement("canvas"); // window.WebGL2RenderingContext 를 아래에서 똑같이 사용하면 WebGL 2.0 확인 가능 return !!( window.WebGLRenderingContext && (canvas.getContext("webgl") || canvas.getContext("experimental-webgl")) ); } catch (err) { retu..
[TypeScript] Barrel의 장점과 단점
·
🎨 프론트엔드 공부/JS & TS
📍Barrel 여러 모듈의 export 를 하나의 모듈(주로 index.ts)에서 import로 받아 다시 export 해주는 파일 예를 들어 아래와 같은 3개의 모듈이 각각 존재할 때 // src/lib/foo.ts export class Foo {} // src/lib/bar.ts export class Bar {} // src/lib/baz.ts export class Baz {} barrel이 없으면 3개 라인의 import가 필요함 // src/pages/page.ts import { Foo } from '../lib/foo'; import { Bar } from '../lib/bar'; import { Baz } from '../lib/baz'; barrel 파일(lib/index.ts) 을 ..