선호:하다

자바스크립트의 함수는 호출될 때 전달되는 인자값 이외에, arguments 객체와 this를 암묵적으로 전달 받는다. 자바스크립트의 this 키워드는 자바에서의 개념과 달라 혼란을 줄 수 있다. 자바에서 this는 인스턴스 자신을 가리키는 참조변수이다. 주로 매개변수와 객체 자신이 가지고 있는 멤버변수명이 같을 경우 이를 구분하기 위해 사용된다. public Class Person { private String name; public Person(String name) { this.name = name; } } 하지만 자바스크립트의 경우 함수 호출 방식에 따라 this에 바인딩되는 객체가 달라진다. 함수 호출 방식은 아래와 같이 다양하다. 1. 함수 호출 2. 메소드 호출 3. 생성자 함수 호출 4. a..

클로저 클로저를 쉽게 정의하면 다음과 같이 정의할 수 있다. 클로저란 자신이 생성될 때의 환경을 기억하는 함수이다. 클로저는 자바스크립트 고유의 개념이 아니라 다양한 프로그래밍 언어에서 사용되는 중요한 특성이다. 위 정의에서 말하는 '함수'란 반환된 내부함수를 의미하고 '자신이 생성될 때의 환경'이란 내부함수가 선언됬을 때의 스코프를 의미한다. 즉, 클로저는 반환된 내부함수가 자신이 선언됬을 때의 스코프를 기억하여 해당 스코프 외부에서 호출되어도 해당 스코프에 접근할 수 있는 함수를 말한다. function outer() { var a = 2; function inner() { console.log(a); } return inner; } var func = outer(); func(); // 2 위의 코..

본문에 들어가기 앞서 이벤트 등록에 대해 알고 있어야한다. 아이템 추가 const button = document.querySelector('button'); button.addEventListener('click', addItem); function addItem(event) { console.log(event); } 위 코드는 버튼을 클릭했을 때 addItem이라는 함수가 실행되도록 하는 코드이다. 이와 같이 addEventListener()를 통해 HTML 요소에 동적인 기능을 추가할 수 있게 된다. 여기서 브라우저는 어떻게 이벤트의 발생을 감지하게 되는지 알아보자 이벤트 버블링 - Event Bubbling 이벤트 버블링은 특정 화면 요소에서 이벤트가 발생했을 때 해당 이벤트가 상위의 화면 요소들..

push() 배열의 끝에 n개의 요소를 넣는다. const numArr = [1, 2, 3, 4, 5]; numArr.push(6, 7, 8); console.log(numArr); // [1, 2, 3, 4, 5, 6, 7, 8] pop() 배열의 마지막 요소를 제거하고 해당 요소를 리턴한다. const numArr = [1, 2, 3, 4, 5]; const popped = numArr.pop(); console.log(popped);//5 console.log(numArr);//[1, 2, 3, 4] unshift() 배열의 앞에 n개의 요소를 넣는다. const numArr = [2, 3, 4]; numArr.unshift(0, 1); console.log(numArr); // [0, 1, 2, ..

JS를 사용하며 배열을 자연스럽게 써왔지만, 배열에 대해 자세히 공부해본 적이 없었다. JS 문법을 기초부터 공부할 기회가 생겨 배열 생성 방법과 배열 메소드들을 정리해보고자 한다. 자바스크립트에서 배열은 배열 리터럴, Array 생성자 함수, Array.of 메서드, Array.from 메서드를 통해 생성할 수 있다. 배열을 생성하는 방법이 4가지나 있기 때문에 각각의 생성 방식과 특징을 제대로 이해해야 목적에 맞는 방법을 선택할 수 있을 것이다. 1. 배열 리터럴 가장 단순하고 직관적인 배열 생성 방식이며 대부분의 브라우저에서 가장 성능이 좋은 배열 생성 방법이다. const a = []; const b = [1, 2, 3]; 배열 내부에서 spread 문법을 사용하여 기존의 배열을 활용한 새로운 배..