✅ classList 엘리먼트.classList.add('추가할 클래스명') 엘리먼트.classList.remove() ex) -html파일 내 .. 잠깐만!!다중클래스,다중선택자 //html => 클래스가 navbar, first 두개인거임! //css .navbar.first => 클래스가 navbar랑 first 두개 다갖고있는놈 .first, .second => 반점을 찍으면 클래스 first랑 second 인놈들 선택할게요 -css파일 내 .navbar{ background-color:black } .navbar.invisible{ display:none; } -js파일 내 const navbar = document.querySelector('.navbar') navbar.classList.ad..
**모듈과 같이 오늘 내용도 중요** 동기 비동기에 대하여.. https://jwinjection.tistory.com/62 동기, 비동기(콜백함수) 자바스크립트는 기본적으로 동기실행방식이다 a->b->c (a가 다끝나야지만 b가 실행되고 그다음 c실행) =>이게 동기식 하지만 setTimeOut과 같은 콜백함수를 쓰게 되면 비동기식으로 처리를 하게되고 a jwinjection.tistory.com ✅ promise https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise 비동기 작업이 맞이할 미래의 완료 또는 실패와 그 결과 값을 나타냅니다 - 프로미스 자바스크립트 비동기 처리에 사용되는 객체 - 주로 서버..
✅ 주석 //한줄짜리 주석 /* */ 여러줄 주석 /** */ JsDoc을 사용하면 좋음 --> 주석은 코드 자체를 설명하는 것이 아닌 왜(why)와 어떻게(how)를 설명하는 것이 좋음 /** * JsDoc * 주어진 두 인자를 더한 값을 반환함 * @param {*} num1 숫자1 * @param {*} num2 숫자2 * @returns num1 num2을 더한값 */ function add(num1,num2){ return a+b; } ✅ 예외처리 try{ 예외가 발생할 것으로 예샹하는 문장; ... }catch(error객체){ 예외가 발생했을 대 처리할 문장; ... }finally{ 예외외 관계없이 무조건 실행할 문장; ... } function readFile(path){ throw ne..
| 이벤트(Event) - 웹 브라우저가 알려주는 HTML 요소에 대한 사건을 발생 - 웹 페이지에 사용된 자바스크립트는 발생한 이벤트에 반응하여 특정 동작을 수행할 수 있음 - 자바스크립트는 비동기식 이벤트 중심의 프로그래밍 모델 ------ ------- ------- 이벤트타겟 이벤트타입 이벤트리스너 | 이벤트타입(Event Type) - 발생한 이벤트의 종류를 나타내는 문자열로 이벤트명이라고도 함 - 키보드, 마우스, HTML DOM, window 객체등을 처리하는 이벤트 제공 - https://developer.mozilla.org/ko/docs/Web/Events - on이 안붙어있는이유는 on은 html에서 만 붙이는거고 js기준으로 만들어진거라 on안붙음 이벤트타겟(Event Target)..
| 함수 1. 함수의 기본 function sum(num1, num2){ console.log('sum() 호출!'); return num1 + num2; } const result = sum(10,3); console.log(result); --결과-- sum() 호출! 13 함수 메모리 const add = sum ; //메모리 주소만 복사한것이라 같은곳을 가리키기게됨 console.log(sum(10,3)); console.log(add(10,3)); --결과-- sum() 호출! 13 sum() 호출! 13 함수 작성법(팁!) 조건이 맞지 않는 경우 함수 도입부분에서 함수를 미리 종료! function print(num){ if(num < 0){ return; //함수의 결과값 전달 + 함수종료를..
| history 객체 - 브라우저의 히스토리 정보를 문서와 문서 상태 목록으로 저장하는 객체 - 사용자의 개인 정보를 보호하기 위해 이 객체의 대부분의 접근 방법을 제한 back(): 뒤로 이동 forward(): 앞으로 이동 go(0): 새로고침 location.reload(): 새로고침 history 뒤로가기 앞으로 새로고침 | navigator 객체 브라우저 공급자 및 버전 정보등을 포함한 브라우저에 대한 정보를 저장하는 객체 geolocation: GPS정보를 수신하는 프러퍼티 navigator 실행하면 위치 허용하겠냐고 뜸 허용 누르면 콘솔창에 위도 경도 뜸 구글지도에 둘다 복붙해서 검색하면 자기집 인터넷 기지국 주소를 알아낼수있다 휴대폰으로 실행하면 보다 더 정확한 위치알아낼수있음 | 문서 ..
