JEEYOUNG.ME

ES6(ECMAScript 2015) 에서 새로 생긴 spread operator. spread operator는 반복 가능한(iterable) 객체에 적용할 수 있는 문법으로, 배열이나 문자열 등을 개별 요소로 분리시킬 수 있다. // ES6에서는 배열에 대한 스프레드 문법 사용 가능 const arr1 = [1, 2, 3]; const arr2 = [...arr1, 4, 5]; 사용하는 이유?🤔 원본배열 또는 객체를 변경하지 않고 새로운 복사본을 만들기 위해서다. 자바스크립트에서 배열과 객체는 참조에 의해 전달되기 때문에 그냥 대입하면 참조 주소만 복사되어 두 변수가 같은 객체를 가리키게 됨. 스프레드 문법 사용할때 vs 사용안할때 차이점은? // 원본 배열 const originalArray = [..

Ajax란? Ajax는 자바스크립트를 사용해 브라우저가 서버에게 비동기 방식으로 데이터를 요청하고, 서버가 응답한 데이터를 수신하여 웹페이지를 동적으로 갱신하는 프로그래밍 방식이다. Ajax는 XMLHttpRequest 객체를 기반으로 동작하며, http 비동기 통신을 위한 메서드와 프로퍼티를 제공한다. 전통적인 웹페이지의 생명주기 예전의 웹페이지는 완전한 html 태그로 감싸진 html 파일을 서버로부터 전송받아 웹페이지 전체를 처음부터 다시 랜더링 하는 방식으로 동작했다. 따라서 클라이언트가 화면전환을 요청하면, 서버로부터 새로운 html을 전송받아 웹페이지 전체를 다시 새로고침 해야했다. 위와 같이 동작하면 어떤 단점이 있을까? 1. 변경될 필요가 없는 부분까지 매번 서버로부터 재전송 받기때문에 불..

'모던 자바스크립트 Deep Dive' (36장)을 읽고 정리한 글입니다 객체를 1개 이상의 변수에 개별적으로 할당하고 싶을때, 객체 리터럴에서 필요한 값만 추출하여 변수에 할당시키는 방식을 Destructuring Assignment, 디스트럭처링 할당이라고 한다. 자바스크립트에서 배열과 객체를 각각 분할해서 변수에 할당시키는 방식을 알아보자. 1. 배열 디스트럭처링 (ES6 기준) const arr = [1, 2, 3]; // ES6 배열 디스트럭처링 할당 const [one, two, three] = arr; console.log(one, two, three);// 1 2 3 위의 코드를 보면 변수 one, two, three를 선언하고 배열 arr를 비구조화(디스트럭처링) 하여 변수에 할당시켜 준..