모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.화살표 함수간략하게 함수를 선언시킨다.(x, y) => { ... } 방식으로 선언 🎈참고자료https://poiemaweb.com/es6-arrow-function
FrontEnd/JavaScript
모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.템플릿 한번에 여러줄의 문자열을 입력받을수있다. ` 를 사용한다.
모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1.letvar키워드를 통한 함수레벨 스코프를 가지는것 대신 let 키워드를 사용하여다른 언어처럼 블록레벨 스코프를 지원할수있다. 2.const상수를 위해 사용(재할당 불가능 = 선언과동시에 할당)블록레벨 스코프를 갖는다하지만 const의 타입이 객체일때 객체의 프로퍼티는 변경가능하다.const me={age:20};me.age=10;document.write(me.age+"") 🎈참고자료https://poiemaweb.com/es6-block-scope
모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1. SPA (Single Page Application)단일 페이지에서 페이지를 갱신하여 View를 바꿔 사용자에게 여러 페이지를 보는것같은 경험을 하게한다. 2. Routing사용자가 태스크를 수행하기 위해 어떤 화면에서 다른 화면으로 화면을 전환하는 내비게이션을 관리하기 위한 기능(URL이동, 태그 이동, 뒤로가기,앞으로가기) 🎈참고자료https://poiemaweb.com/js-spa
모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1.REST APIHTTP 프로토콜을 의도에 맞게 디자인하도록 유도하는 REST의 원칙에 따른 api 2.REST 원칙2-1.URI는 정보의 자원을 표현URI는 자원을 표현하는데 중점을 두어야 한다.(REST에서 URL은 자원이다.) 2-2.HTTP Method자원에 대한 행위는 HTTP Method(GET, POST, PUT, DELETE 등)으로 표현이를 통해 CRUD를 구현한다.GET: 리소스를 조회(index)POST: 리소스를 생성(Create)PUT: 리소스 전체를 교체(replace)PATCH: 리소스 일부를 수정(modify)DELECT: 리소스를 삭제(Delete) 3.REST API 구성자원:HTTP URI행위..
모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.1.AJAX(Asynchronous JavaScript and XML)자바스크립트로 비동기적으로 서버와 브라우저가 데이터를 교환할 수 있는 통신 방식 2.JSON (JavaScript Object Notation)효과적인 데이터 구조화가 가능한 데이터 포맷순수한 텍스트로 구성된 규칙이 있는 데이터 구조{ "name":"Park", "gender":"male", "age":10} 2-1.stringify객체를 JSON 형식의 문자열로 변환 2-2.parseJSON 데이터를 가진 문자열을 객체로 변환 3.XMLHttpRequestXMLHttpRequest 객체를 이용하여 Ajax 요청을 생성하고 전송co..
모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다. 1.이벤트사용자와 웹페이지가 상호작용하도록 해주는것 1-1.이벤트 종류https://developer.mozilla.org/en-US/docs/Web/Events 1-2.인라인 이벤트 핸들러오래된 방식this는 전역 객체 window버튼버튼">HTML 삽입미리보기할 수 없는 소스 1-3.이벤트 핸들러 프로퍼티 방식this는 이벤트에 바인딩된 요소를 가리킨다버튼2버튼2">HTML 삽입미리보기할 수 없는 소스 1-4.addEventListener 메소드DOM 요소에 이벤트, 해당 이벤트의 콜백함수를 지정한다.(this 는 이벤트 리스너에 바인딩된 요소를 나타낸다.)버튼3버튼3">HTML 삽입미리보기할 수 없는 소스 2...
모던 자바스크립트 Deep Dive를 참고하여 학습,작성하였습니다.동기식 vs 비동기식동기식 처리 모델은 하나의 작업이 실행될때 다른 작업은 실행되지않고 대기하게된다.비동기식 처리 모델은 병렬적으로 작업을 처리한다. 하나의 테스크가 종료되지않더라도 다음 작업을 처리하게된다. 자바스크립의 DOM 이벤트 헨들러, Timer함수는 비동기 처리모델이다. 해당 코드에서 func2는 비동기 처리함수은 Timer가 있으므로 시간이 0이여도 func3가 실행된다음에 func2가 처리가 끝나는것을 볼수있다.function func1() { console.log('func1');}function func2() { setTimeout(function() { console.log('func2'); }, 0);}fu..
