목록Web/Javascript (8)
에르노트
ES6 이후로 자바스크립트에 객체 확장 표현식과 구조 분해 할당이 추가되면서 객체를 다루기가 한결 수월해졌다. 객체 확장 표현식(Enhanced Object Property) 기존 let x = 0 let y =0 let obj = {x:x, y:y} //Original let obj2 = {method1: function(){console.log("Method 1")}} //Original let key1 = 'key1' let combined = {}; combined[key1 + 'key2'] = 'abc' //Original console.log(obj) console.log(obj2) console.log(combined) 객체 확장 표현식 let x = 0 let y =0 let obj = {..
자바스크립트는 기본적으로 집합(Set) 클래스를 지원한다. Set The Set object lets you store unique values of any type, whether primitive values or object references. developer.mozilla.org 자바스크립트에서 집합(Set)이란 중학교 때 처음 배우는 바로 그 집합 개념이다. 이를 일반화해서 얘기하면 유한하고 구분되는 항목들의 그룹이라고 표현할 수 있다. 좀 더 엄밀히 얘기하자면 중복을 허용하지 않고 정렬되지 않은 항목들을 그룹이다. 따라서 정의에 맞게 그 용도 역시 항목의 유일성을 확인하는 것이다. 생성 let set1 = new Set([1,2,3]) let set2 = new Set('123') cons..
자바스크립트 배열에는 sort() 함수가 내장되어 있다. 따라서 우리는 별도로 정렬 메소드를 작성하지 않고도 손쉽게 배열의 원소들을 정렬할 수 있다. 이때 정렬 기준을 지정하기 위해 비교 함수(compare function)을 인자로 받는다. 다음은 ECMAScript의 Array.prototype.sort(comparefn) 에 대한 최신 명세이다. The elements of this array are sorted. The sort must be stable (that is, elements that compare equal must remain in their original order). If comparefn is not undefined, it should be a function that a..
브라우저 환경에서는 쓸만한 최소한의 인터페이스로 경고창, 입력창, 확인창이 기본 제공된다. 각각의 대화 상자는 상응하는 자바스크립트 내장 함수를 호출함으로써 만들어낼 수 있다. 경고창(alert) alert("경고!") alert() 함수를 이용하면 모달창을 띄울 수 있다. 여기서 모달창(modal window)란 사용자 입력을 독점하는 창을 의미한다. 즉 경고창이 띄워지면 경고창이 없어질 때까지 주변의 다른 버튼들은 비활성화 된다는 것이다. 입력창과 확인창도 마찬가지로 모달창이다. 입력창(prompt) let age = prompt("나이를 입력하세요", 22) alert(`당신의 나이는 ${age}입니다.`) prompt(메세지, 기본값) 형태로 사용할 수 있다. prompt() 함수는 사용자가 입력..
자바스크립트를 독학할 때 유용한 웹페이지들을 몇 개 정리해본다. 1. MDN web docs JavaScript JavaScript (JS) is a lightweight, interpreted, or just-in-time compiled programming language with first-class functions. While it is most well-known as the scripting language for Web pages, many non-browser environments also use it, such as Node.js, Apache developer.mozilla.org 가장 기본이 되는 공식 문서다. 영어와 한국어를 비롯한 매우 다양한 언어를 지원한다. 다만 번역 상태..
여타 프로그래밍 언어들처럼 자바스크립트도 배열을 자료형으로 제공하며, 이 배열을 다루기 위한 Array를 내장 객체로 제공한다. Array Array The JavaScript Array class is a global object that is used in the construction of arrays; which are high-level, list-like objects. developer.mozilla.org 자바스크립트 배열은 길이가 가변적이며 요소의 타입에도 제약이 없다는 점에서 기존 언어의 배열보다도 파이썬의 리스트와 유사하다. 그래서 JS 배열에는 [1, 'a', true]와 같이 자료형과 무관하게 아무 요소나 다 들어갈 수 있다. 이게 싫어서 타입을 딱 정해놓고 싶다면 ES6에 새롭게..
Math 클래스 String 클래스 Date 클래스 Math 클래스 Math Math is a built-in object that has properties and methods for mathematical constants and functions. It’s not a function object. developer.mozilla.org 자바에서처럼 자바스크립트의 Math 라이브러리는 static 클래스(모든 프로퍼티와 메서드가 static)이다. 그래서 객체 생성 과정 없이 바로 Math.func() 형태로 사용할 수 있다. 여타 언어가 제공하는 수학 관련 클래스와 마찬가지로 자연상수 e나 원주율 pi 등의 상수를 제공하며 절대값이나 제곱근 및 랜덤 등의 연산도 제공한다. 또 sin, cos, t..
자바스크립트에서 일정 시간마다 특정한 동작을 수행하고 싶을 때는 자체적으로 제공되는(내장 함수) 타이머 함수를 사용할 수 있다. - setInterval() 일정 시간마다 주기적으로 특정 구문을 실행하는 기능 - setTimeout() 일정 시간이 지난 후 특정 구문을 딱 한번 실행하는 기능 - clearInterval() 실행중인 타이머 함수를 멈추는 기능 setInterval() WindowOrWorkerGlobalScope.setInterval() The setInterval() method, offered on the Window and Worker interfaces, repeatedly calls a function or executes a code snippet, with a fixed ti..