spread operator (전개구문) 1. 반복 가능한(iterable) 요소에 적용할 수 있는 문법입니다. ex) 배열이나 문자열 등 2. 배열이나 문자열 등을 풀어서 요소 하나하나로 전개시킬 수 있다. 기존에는 index를 사용해서 배열의 값을 뽑아낼 수 있었지만, 배열이름 앞에 ...을 넣어주면 배열의 값을 바로 차례대로 뽑아준다. let arr = [1,2,3]; //전개구문은 반복이 가능한 요소에서만 사용 가능함 (ex.배열, 문자열 / 객체는 안됨)) console.log(...arr); //전개구문 //1 2 3 배열의 요소를 풀어서 나열시킨다. let str = "hello"; console.log(...str); console.log([...str]); // ['h', 'e', 'l'..

let과 const let 변수 - 자바와 같음 1. let 변수는 중복선언이 🔥불가능X 하다. 2. let 변수의 유효범위는 {} 중괄호 블록이다. var 변수는 함수 스코프 (함수 범위에서까지 유효) let 변수는 중괄호 스코프 (중괄호 범위에서까지 유효) 목록1 목록2 목록3 목록4 var 변수는 함수 스코프이기때문에 계속 4가 출력됨 for(var i = 0; i < lis.length; i++){ lis[i].onclick = function(){ console.log(i); //4 } } for(var i = 0; i < lis.length; i++){ (function(x){ lis[x].onclick = function(){ console.log(x); //4 } })(i); } let 변..

AJAX(Asynchronous Javascript and XML) 비동기적 자바스크립트 그리고 xml 은 웹페이지의 이동없이 필요한 데이터만 전송하는 기술 ( 화면이동없이 데이터만 전송하는 기술 )입니다. 비동기란 ? 동기란 ? 함수를 실행하면 a함수 끝나고 -> b함수 끝나고 -> c함수 끝나고 이렇게 순서대로 실행하는 방식 블로킹 / 논블로킹 - 함수가 실행되는 도중에 침범할 수 있다 / 없다 함수가 동기와 달리 이전 함수가 끝나길 기다리지 않고 한꺼번에 실행된다! 서버(=자바)와 서버 통신, 클라이언트와 클라이언트 통신 일반적인 경우 데이터 처리는 요청 순서대로 진행하지만 AJAX는 순차적으로 진행하지 않습니다. 이런 방식을 비동기 방식이라고 합니다. 공공데이터 포털 -> 오픈 API 만 사용 가..

쿠키와 세션 : 정보를 지속적으로 유지하기 위한 수단 js 세션 : 브라우저측의 세션 localStorage와 sessionStorage은 브라우저의 키 = 값 형태로 데이터를 저장하는 브라우저 측의 세션입니다. localStorage는 브라우저를 종료하더라도 지속됩니다. (영구지속) sessionStorage는 브라우저를 종료하면 사라집니다. 쿠키와 다른 점은? - 쿠키는 서버간 전송이 가능합니다. - 스토리지는 브라우저에서만 사용 setItem(key, value) – 키-값 쌍을 보관합니다. getItem(key) – 키에 해당하는 값을 받아옵니다. removeItem(key) – 키와 해당 값을 삭제합니다. clear() – 모든 것을 삭제합니다. key(index) – 인덱스(index)에 해당..

쿠키와 세션 : 정보를 지속적으로 유지하기 위한 수단 https://ko.javascript.info/cookie 쿠키와 document.cookie ko.javascript.info js 쿠키(🍪cookie) 쿠키를 문자열로 받음 예제 1 ) 🍪 Cookie의 이름과 🍪 Cookie의 값을 입력 받아 🍪 쿠키를 만들고 🍪 Cookie의 이름을 검색해서 🍪 Cookie 찾기 🍪 1번 🍴 html Cookie Name : Cookie Value : 쿠키 만들기 script //// document.cookie = "키=값"; //// document.cookie = "키=값; expires = UTC스트링시간타입"; //var date = new Date(); //date.setMinutes(date.ge..

콜백함수 프로그램 사이에서 약속되어 있는 함수 호출하면 다시 거기다가 결과를 내가 돌려줄게! geolocation이 콜백함수가 아님 success fail이 콜백함수임 콜백함수

location 객체 자바스크립트 페이지 이동 location.href = 주소 자바스크립트 새로고침 location.reload() location 객체 사용 새로고침 history 객체 브라우저의 기록을 할 수 있는 객체 ex)뒤로가기, 앞으로가기 history.go(숫자); : 기록 이동 history.back(); : 뒤로가기 history.pushState(null, '', '변경.html'); : 새로운 기록 추가 history.replaceState( 저장할데이터 , 바꿀제목 , 바뀐주소 ); : 브라우저의 기록을 강제로 변경 ex)뒤로 갔을때 alert를 하지 않아야 할 때 사용 ex ) list -> 등록 -> 결과 (등록이 잘 완료되었다면 뒤로가기 눌렀을 때 list 페이지를 보여줌) ..

내장함수 : window 객체 , location 객체 , history 객체 팝업창 띄우기 window.open() - 새창을 띄워주는 메서드 입니다 window.open(문서 주소-보여줄 창 주소 , 이름-별칭 , "옵션=값 , 옵션=값 , 옵션=값"); window.close() - 창이 꺼짐 옵션 옵션 설명 width = 픽셀값 가로 넓이 height = 픽셀값 세로 넓이 left = 픽셀값 위치 top = 픽셀값 위치 location = yes 또는 no 윈도우 주소창 show/hide scrollbars = yes 또는 no 윈도우 스크롤바 show/hide menubar = yes 또는 no 윈도우 메뉴바 show/hide toolbar = yes 또는 no 윈도우 툴바 show/hide s..