본문 바로가기
반응형

Language/JavaScript94

[JavaScript] Math.(pow/sqrt) - 거듭제곱/제곱근 Math 함수로 제공하고있는 Math.pow() 와 Math.sqrt() 에 대해 알아보자. 1. Math.pow() - Math.pow() 함수는 base^exponent처럼 base에 exponent를 제곱한 값을 반환한다. - base값이 음수이고 지수(exponent)값이 정수가 아닌 경우 결과는 NaN을 반환한다. 1-1. 구문과 기본사용법 ▷ 구문 Math.pow(base, exponent) base : 밑 값 (기준값) exponent : base값을 제곱하기 위해 사용하는 지수 ▷ 예제 1 ) Math.pow() 기본 사용법 console.log(Math.pow(7, 3)); // expected output: 343 console.log(Math.pow(4, 0.5)); // expect.. 2022. 1. 31.
[JavaScript] arr.sort() - 배열 요소를 오름차순, 내림차순으로 정렬하기 (ft. 숫자, 문자열, 객체) Array.prototype.sort() 라는 배열 메서드는 대상 배열의 요소들을 오름차순, 내림차순으로 정렬해주는 메서드이다. ▷ 구문 arr.sort([compareFunction]) compareFunction : 정렬 순서를 정의하는 함수이다. - 생략할 경우 : 배열은 각 요소를 문자열로 변환하고 유니코드를 기준으로 정렬을 실시한다. - 사용할 경우 : 비교 후 반환 값에 따라 정렬된다. 일반적으로 compareFunction(a, b) 형식의 a, b 매개변수를 사용한다. 일반적으로 반환 값은 (1, 0, -1)을 사용한다. a, b를 비교해서 반환 값이 0보다 클 경우, b가 a보다 앞에 오도록 정렬한다. a, b 를 비교해서 반환값이 0을 반환할 경우, a와 b의 순서를 변경하지 않는다. .. 2022. 1. 31.
[JavaScript] arr.every() - 배열에 존재하는 "모든"값이 특정 조건을 만족하는지 판별하는 함수 Array.prototype.every() 이라는 배열 메서드는 대상 배열에 존재하는 "모든"값이 특정 조건에 만족하는지 확인하는 메서드이다. ▷ 구문 arr.every(callback(curentValue, index, array)[, thisArg]) callback : function 안에서 조건을 체크하며, true/false를 반환한다. curentValue: 현재 요소 (ex. 반복문의 현재 요소) index : 현재 요소의 인덱스 array :대상 배열 thisArg : callback을 실행할 때 this로 사용하는 값. ▷ 예제1) Array.prototype.every() 기본 사용법 var arr = [0,1,2,3,4] // result : false arr.every(functio.. 2022. 1. 15.
[JavaScript] for of 반복문을 사용한 Map, Set 등의 객체 반복하기 ES6부터 새롭게 생겨난 반복문 for...of 에 대해 알아보고자 한다.for...of 문은 반복가능한 객체(Array, Map, Set, String, TypedArray, arguments 객체 등)를 반복하는 문법이다. ▷ 구문for (variable of iterable) {     statement}variable: 각 반복에 서로 다른 속성값이 variable에 할당된다.iterable : 반복되는 열거가능(enumerable)한 속성이 있는 객체. 예제를 통해 쉽게 접해보자.▷ 예제1) Array에 대한 반복let arr = [1, 2, 3];for (let value of arr) { console.log(value); //1, 2, 3} ▷ 예제2) String에 대한 반복let st.. 2022. 1. 14.
[JavaScript] Map(), Set() 객체의 특징과 사용법 ES6에서 새롭게 등장한 자료구조인 맵(Map) 과 셋(Set) 객체에 대해 알아보자.1. 맵(Map)- 맵(Map)은 키가 있는 데이터를 저장한다는 점에서 객체(obj)와 유사하다.- 객체는 키값으로 문자열만 사용 가능하지만 맵(Map)은 다양한 자료형을 허용한다.- 객체는 삽입된 순서를 기억하지 못하지만 맵(Map)은 삽입된 순서를 기억해 반복문 사용시 삽입 순서대로 반복된다. 1-1. 주요 메서드와 프로퍼티맵(Map)에서 주요 사용되는 메서드와 프로퍼티는 다음과 같다.new Map(iterable) : 맵 객체를 만든다. (매개변수로 [키, 값] 으로 이루어진 배열이나 이터러블 객체를 전달하면 그안의 값을 복사해 맵에 넣어준다.)set(key, value) : key를 이용해 value를 저장한다... 2022. 1. 14.
[JavaScript] async와 await - Promise syntactic sugar 비동기 처리를 도와주는 async와 await에 대해 알아보자. 기존의 비동기 처리 방식인 콜백 함수와  프로미스(Promise)의 단점을 보완하고 개발자가 일기 좋은 코드를 작성할 수 있게 도와주는 문법인데, 제목에서 말한것처럼 Promise의 syntactic sugar라고 보면 된다. 기존에 없던게 아니고 그냥 좀더 Promise를 사용하기 쉽게 도와주는 문법이라 생각하면 될 것 같다.(object와 class의 관계랄까...?) 코드를 통해 하나씩 알아가보자.1. async 사용법// 1.함수로 만들어진 기본 promise 문법 (async x)function blog() { return new Promise((resolve, reject) => { resolve('mine-it.. 2022. 1. 14.
[JavaScript] Promise란? - 비동기 처리를 위한 객체 ES6부터 정식으로 지원해주기 시작한 Promise 객체에 대해 알아보자. Promise란 말 그대로 '약속(프로미스)'을 의미하는데,이는 최종 결과를 반환한다기보다는 미래의 어떤 시점에 결과를 제공하겠다는 의미로 보면 된다. 코드를 통해 하나씩 알아가보자.1. Promise() 기본 구조const promise = new Promise((resolve, reject) => { // ...비동기 처리할 영역 // 보통 network 통신에 사용된다.});우선 Promise() 객체의 기본 구조에 대해 알아보자. Promise 객체는 3가지 상태를 가진다.대기(pending) : 이행하지도, 거부하지도 않은 초기 상태이행(fulfilled) : 연산이 성공적으로 완료됨거부(rejected) : .. 2022. 1. 14.
[JavaScript] 클래스(Class)문법에 대하여 ES6부터는 자바스크립트 또한 Class문법을 사용할 수 있게 되었다. 자바스크립트에서의 Class는 함수라는 것을 알아두고 클래스(Class)문법에 대해 하나씩 알아가보자.1. 클래스(Class) 정의1-1. 클래스 선언class Rectangle { constructor(height, width) { this.height = height; this.width = width; }}우선 클래스를 선언하는 방식은 매우 간단한데, 위 예제처럼 [ Class 클래스명 ] 구조로 선언해주면 된다. 위에서 클래스를 함수라고 설명했지만 예외가 있는게, 클래스는 호이스팅(Hoisting)이 불가능하기 때문에 반드시 먼저 선언하고 인스턴스를 생성하거나 호출해야한다. 1-2. 클래스 표현식// unname.. 2022. 1. 7.
[JavaScript] 향상된 객체 리터럴(Enhanced Object property) ES6에서 객체 리터럴 프로퍼티 기능이 향상되었는데, 향상된 객체 릴터럴에 대해 알아보자.1. 객체 프로퍼티 축약 표현 //ES5var mine = 'Mine';var it_record = 'ItRecord'var fn = function(){return 'fn'};var obj = { mine : mine, it_record : it_record, fn : fn}console.log(obj); // {mine: 'Mine', it_record: 'ItRecord', fn: ƒ}//ES6let mine = 'Mine';let it_record = 'ItRecord'let fn = () => 'fn';const obj = {mine, it_record, fn}console.log(obj); // {m.. 2022. 1. 3.
반응형
TOP