🌎 Web/JavaScript

[JavaScript] 자바스크립트의 클래스(Class)

클래스란? 클래스(Class)란 객체 지향 프로그래밍에서 특정 객체를 생성하기 위해 변수와 메서드를 정의하는 일종의 틀로, 객체를 정의하기 위한 상태(멤버 변수)와 메서드(함수)로 구성된다. ES6에 도입되었으며, JavaScript 객체용 템플릿이라고 볼 수 있다. 클래스 생성 class ClassName { constructor() { ... } } class 키워드를 사용한다. 생성자 메서드 constructor()를 사용한다. name과 year 속성을 가진 'Car'라는 클래스를 만들어보자. class Car { constructor(name, year) { this.name = name; this.year = year; } } // 객체 생성 let myCar1 = new Car("Ford",..

[JavaScript] try / catch로 예외 처리하기

예외 처리란? 예외는 프로그램 실행 중에 발생하는 런타임 오류를 의미한다. 이러한 예외가 발생했을 때 프로세스는 더 이상 동작하지 않기 때문에 try / catch / finally를 사용한 예외처리를 통해 프로세스가 동작할 수 있게 해주어야 한다. try / catch / finally try { 예외를 처리하길 원하는 실행 코드; } catch (ex) { 예외가 발생할 경우에 실행될 코드; } finally { try 블록이 종료되면 무조건 실행될 코드; } try 블록 - 기본적으로 가장 먼저 실행되고, 에러 발생이 예상되는 코드를 작성한다. (기본) catch 블록 - try 블록에서 발생한 예외 코드나 Error 객체를 인수로 전달받아 처리한다. (옵션) finally 블록 - 예외처리와 관계..

[JavaScript] 자바스크립트의 새로운 자료구조 Set, Map

Set이란? Set이란 중복을 허용하지 않는 값을 모아놓은 특별한 컬렉션이다. 중복 값 여부는 배열에서도 find() 메서드를 이용하여 확인할 수 있지만, 배열 내 전체 요소를 순환하여 찾기 때문에 성능면에서 Set보다 효율적이지 않다. Set은 값의 유일무이함을 확인하는 데에 최적화되어있다. Set 메서드 or 프로퍼티 new Set() or new Set(iterable) - Set 객체 생성 및 초기화. iterable 객체를(주로 배열) 전달받으면 그 안의 값을 복사해서 넣어준다. // Set 객체 생성 const letters = new Set(["a","b","c"]); // Set 객체 생성 const letters = new Set(); // Set 객체에 add로 값 추가 letters...

[JavaScript] 자바스크립트의 배열(Array)

배열이란? 자바스크립트에서 배열(Array)은 이름과 인덱스로 참조되는 정렬된 값의 집합이다. 각각의 값인 요소(element)와 위치를 가리키는 인덱스(index)로 구성되어 있다. 배열의 특징 주로 const로 선언한다. 배열 이름은 보통 복수형으로 작성한다. 객체와는 다르게 index 번호로 구분되기 때문에 순서가 중요하다. 같은 배열에 있는 배열 요소끼리의 타입이 다를 수도 있다. 배열 요소의 인덱스가 연속적이지 않아도 되고, 따라서 특정 배열 요소가 비어 있을 수도 있다. (undefined) 자바스크립트에서 배열은 Array 객체로 다뤄진다. 하나의 이름으로 다양한 데이터를 다룰 수 있기 때문에 활용도가 높다. 배열의 마지막 인덱스는 배열.length - 1 이다. const fruits = ..

[JavaScript] 자바스크립트의 반복문(while문, for문)

반복문이란? 반복문(iteration statements)이란 프로그램 내에서 똑같은 명령을 일정 횟수만큼 반복하여 수행하도록 제어하는 실행문이다. 자바스크립트에서 사용할 수 있는 반복문의 형태는 다음과 같다. while 문 do / while 문 for 문 for / in 문 for / of 문 1. while 문 while (표현식) { 표현식의 결과가 참인 동안 반복적으로 실행하고자 하는 실행문; } 특정 조건을 만족할 때까지 계속해서 주어진 실행문을 반복 실행한다. 내부에 표현식을 변경하는 실행문을 빼먹으면 무한루프에 빠지므로 주의해야 한다. 주로 반복 횟수를 예상하기 어렵거나, 특정할 필요가 없을 때 사용한다. 2. do / while 문 do { 표현식의 결과가 참인 동안 반복적으로 실행하고자..

[JavaScript] 자바스크립트의 조건문(if문, switch문)

조건문이란? 조건문(conditional statement)이란 프로그램 내에서 주어진 표현식의 결과에 따라 별도의 명령을 수행하도록 제어하는 실행문이다. 자바스크립트에서 사용할 수 있는 조건문의 형태는 다음과 같다. if 문 if / else 문 if / else if / else 문 switch 문 1. if 문 if (표현식) { 표현식의 결과가 참일 때 실행하고자 하는 실행문; } 표현식의 결과가 참(true)이면 주어진 실행문 실행, 거짓(false)이면 아무것도 실행하지 않는다. 실행문이 1줄 뿐이라면 중괄호를 생략할 수 있다. 2. if / else 문 if (표현식) { 표현식의 결과가 참일 때 실행하고자 하는 실행문; } else { 표현식의 결과가 거짓일 때 실행하고자 하는 실행문; }..

[JavaScript] 자바스크립트 숫자 메서드 총정리

Number.prototype 메서드 toString() - 숫자를 문자열로 반환 toFixed() - 지정된 소수 자릿수로 작성된 숫자를 문자열로 반환 toPrecision() - 지정된 길이로 작성된 숫자를 문자열로 반환 valueOf() - number 타입으로 반환 Number 메서드 Number() - 변수를 숫자로 반환 Number(true); // 1 Number(false); // 0 Number("10"); // 10 Number(" 10"); // 10 Number("10 "); // 10 Number(" 10 "); // 10 Number("10.33"); // 10.33 Number("10,33"); // NaN Number("10 33"); // NaN Number("John");..

[JavaScript] 자바스크립트 문자열 메서드 총정리

문자열 길이 length - 문자열의 길이 반환 let txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ"; let length = txt.length; // 26 문자열 부분 추출 문자열의 일부를 추출하고 새 문자열로 반환 slice(startIndex, endIndex) - 매개변수로 시작 위치와 끝 위치(포함 X)를 사용한다. 매개변수가 음수이면 문자열의 끝에서 시작한다. substring(startIndex, endIndex) - slice와 비슷하나, 매개변수로 음수는 사용할 수 없다. substr(startIndex, length) - slice와 비슷하나, 두 번째 매개변수는 추출할 부분의 길이를 지정한다. let str = "Apple, Banana, Kiwi"; let star..