My devlog

콜스택 setTimeout(() => { console.log("timeout"); }, 1000); function a() { console.log("A"); function b() { console.log("B"); } b(); } a(); 큐 내에 순서 micro 1 브라우저마자 다름 macro Animation DOM api node vs element node 123 abc element // qeuryselector 는 요소를 찾음 const divEl = document.querySelector("div"); // qeuryselectorAll 는 nodelist 라는 배열 데이터처럼 생긴 개체를 찾음 //nodelist // Object object const divNodeList = do..

원시형 데이터 종류: string number boolean undefined null symbol - 똑같은 값은 새로운 메모리에 할당되지 않는다. = 똑같이 생긴 건 똑같은 메모리 주소 참조형 데이터 종류: array object function - 같은 값이라도 다른 메모리에 할당될 수 있다. - 깊은 복사가 필요하다. let btnEl = document.querySelector("button"); const handler = (event) => { console.log(121); }; btnEl.addEventListener("click", handler); btnEl.removeEventListener("click", handler); btnEl = null; 출처 패스트캠퍼스 박영웅 강사님

arrray method .reduce() const arr = [1,2,3,4] let sum =0 for (let i = 0; i acc + cur, 0) const data = [ 'regNum', 'name', 'logo', 'representative', 'startDate', 'address', 'contactEmail', 'tags', 'intro', 'homepage', 'introFile' ] const res = data.reduce((acc, name) => Object.assign(acc, { [..

비교연산자 연산자 이름 == 동등 != 부등 === 일치 !== 불일치 a>b a>=b a

🎥 인강 내보내기 1. Default export - 이름을 지정하지 않아도됌 -> 따라서 디폴트를 import 할땐 이름을 임의로 지정 가능 - 하나의 파일에서 한개의 디폴트만 사용가능 export default function (date) { return Object.prototype.toString.call(data).slice(8,-1) } 2. Named export - 이름을 꼭 지정하여야함 - 여러개 export 가능 export function random(){ return Math.floor(Math.random() * 10) } - 이름을 {}에 넣어서 import import {random, user as kmjin } from './getRandom' // as 를 사용하여 다른 이..

JS 데이터(자료형, Date Type) 원시형 문자 숫자 불린 null undefined 심볼 큰정수(BigInt) 참조형 배열 객체 함수 문자 따옴표로 묶여 있어야 함! "Heropy" 'heropy' `heropy` 숫자 NaN : 숫자로 표시가 불가! (숫자데이터) NaN boolean true false null 값이 없음을 명시적으로 나타낼 때 쓰는 값(데이터) undefined 값이 할당되지 않은 상태를 암시적으로 나타냄 심볼 유일한 식별자(ID) 데이터 이름을 만들 떼 사용 const s = Symbol('hello world!') const user = { name: kmjin [s]: 92 } console.log(user.name) console.log(user[s]) BigInt 큰..

리터럴 방식 특정한 기호로 데이터를 만들어내는 방식 원래는 new 라는 키워드로 각 전역객체들로 데이터를 만들어냄 prototype 문자 str.indexOf(‘heropy’) !== -1 : boolean 데이터로 해당 단어가 있는지 찾는 방법 str.replace( 바꿀 문자, 넣고싶은 문자) str.match( ) str.trim() : 문자열의 앞뒤 공백 제거 숫자 math : 내정 객체. 함수 객체가 아님.. math.floor (math.random() *10) : 랜던한 정수 배열 elements == item forEach : 아이템의 갯수만큼 콜백문을 반복 반환되는 값은 없음 map : 아이템의 갯수만큼 콜백문을 반복하여 리턴을 통해 새로운 배열 생성 filter : 필터링을 해서 새로운..

조건의 내용이 딱 떨어지는 특정한 값일 경우 유용 switch (a) { case 0 : console.log('a is 0') break case 2 : console.log('a is 2') break case 4 : console.log('a is 4') break default : console.log('rest...') } - break 가 없으면 계속 실행되기 때문에 한 케이스가 끝난 후에는 사용해야 함 - defalt 위에 조건이 모두 아닐 경우 실행

2차원 레이아웃을 구현하기 위해 사용 (flex 는 1차원 레이아웃) container 와 item로 구성

배치 - 외부여백을 자동으로 계산 가능하게 - 요소 너비가 명시되어 있어야함 - 양 끝점을 위치 기준을 잡아주고 material icons link 로 연결 후 클래스명 meterial-icons 을 가진 요소 내용에 아이콘 이름을 넣으면 사용가능 가상요소는 인라인요소 스타일을 ul에 적용하는거랑 li 에 적용하는 것에 차이? container 랑 item 차이?? BEM 요소__일부분 요소-상태