솔미는 성장중

🎃 .addEventListener() 대상에 이벤트 청취(listen)을 등록. 대상에 지정한 이벤트가 발생했을 때 지정한 함수(Handler) 호출 ex) click, dbclick(더블클릭시), wheel, keydown, mousedown(버튼 누를때), mouseup(버튼 뗄때), mouseenter(포인터가 요소 위로 올라갈 때), mouseleave(포인터가 요소 밖으로 나올 때), mousemove(포인터가 움직일 때), contextmenu(우클릭했을 때) 등등.. click 예시) childEl.addEventListener('click',() => { childEl.classList.toggle('active') //actvie클래스 있으면 없애고, 없으면 만들고. }) wheel 예..

원시 데이터의 "데이터 불변성" 원시 데이터 : String, Number, Boolean, null, undefined 원시 데이터에서는 단순하게 모양이 다르면 false가 나온다고 생각해도 틀리진 않는다. 하지만 정확히는 '메모리 주소'가 같고 다름에 따라 true/false가 바뀐다. let a = 1 let b = 4 console.log(a,b,a===b) //1 4 false -> 메모리 주소가 달라서 false b=a console.log(a,b,a===b) //1 1 true -> b가 a가 가리키는 메모리주소를 가리키게 됨 a=7 console.log(a,b,a===b) //7 1 false -> 메모리 주소가 달라서 false 새로운 원시 데이터를 사용했을 때 그 원시 주소가 기존 메모..

fetch (주소, 옵션) 네트워크를 통해 리소스의 요청(request)과 응답(response)을 처리한다 promise 인스턴스를 반환 console.log(fetch('https://www.omdbapi.com/?apikey=********&s=avengers')) //Promise 📍 fetch를 통해 promise 인스턴스를 반환하니 뒤에 then 메소드를 써줄 수 있다. fetch('https://www.omdbapi.com/?apikey=********&s=avengers')) .then(res => console.log(res)) //Response 📍 json 메소드를 호출해야 데이터를 꺼낼 수 있다. fetch('https://www.omdbapi.com/?apikey=********&..

개념 동기 : 작업을 동시에 수행하거나, 동시에 끝나거나, 끝나는 동시에 시작 비동기 : 시작, 종료가 일치하지 않으며, 끝나는 동시에 시작을 하지 않음 콜백 패턴 예시) 비동기로 작동하는 a함수를 콜백 함수를 통해 a,b순으로 실행되게 만들기 const a = (callback)=>{ setTimeout(()=>{ console.log(1) callback() },1000) } const b = () => console.log(2) // a(()=>{}) a(()=>{ b() }) //1 //2 예시) b함수도 a함수처럼 비동기로 작동하게 const a = (callback)=>{ setTimeout(()=>{ console.log(1) callback() },1000) } const b = ()=>{..

🎯 모듈이란? 특정 데이터들의 집합(파일) 모듈 개념을 사용하기 위해선 index.html 파일에서 main.js를 연결해주는 script태그에 type="module" 속성이 추가되어있어야 한다! 예시) //module.js export const hello = 'Hello world!' //main.js import {hello} from './module.js' console.log(hello) // Hello world! 🎯 Export & Import 패턴 1. 기본 내보내기 : module.js에서 이름이 없으므로 import할 때 임의로 이름 지정 가능! : 하나의 모듈에서 기본 내보내기를 통해서 내보낼 수 있는 데이터는 딱 하나!! //module.js export default 123 /..