Coding Story/JAVASCRIPT
[ JavaScript ] 자바스크립트 프로미스 Promise
프로미스(Promise)란? JavaScript 에서 코드가 순차적으로 일어나는 처리를 동기 처리라 하며, 특정 코드가 처리될 때 까지 기다리지 않고 다음 코드를 먼저 처리하는 걸 비동기 처리라 한다. 이러한 비동기 처리에서 콜백 지옥(Callback Hell) 등의 문제를 해소하기 위해 사용하는 객체, 즉 비동기 처리에서 순차적 처리를 행하기 위해 사용되는 객체가 프로미스(Promise)이다. Promise 를 꼭 사용해야 하는가? 꼭 그런 건 아니다. 굳이 따지면 비동기 처리 때 Promise 를 사용하지 않는 사용자가 대부분일 것이다. 하지만 앞서 언급했 듯 비동기 처리는 순차적으로 처리하지 않는다는 특징이 있는데, 경우에 따라 비동기 처리를 사용함에도 이를 순차적으로 처리해주어야 할 때가 있다. ..
[ JavaScript ] 자바스크립트 비구조화 할당
만약 [ 10, 20, 30 ] 값을 가지고 있는 arr 이라는 배열이 있고, 이를 각각 a, b, c 라는 변수에 담아 콘솔로 찍고자 한다면 아래와 같이 수행할테다. const arr = [ 10, 20, 30 ]; const a = arr[0]; const b = arr[1]; const c = arr[2]; console.log(a); //10 console.log(b); //20 console.log(c); //30 또는 name, age, addr 필드 명을 가지고 있는 obj 라는 객체에서 각각 변수에 할당에 콘솔로 찍고자 한다면 아래와 같을 것이다. const obj = { name: '홍길동', age: 20, addr: '서울' }; const name = obj.name; const a..
[ JavaScript ] 자바스크립트 indexOf( ) 함수
이전 포스팅에선 여러 값을 가지고 있는 배열에서 특정 조건을 주어 값을 걸러내는 방법을 다뤘다. 이번엔 배열이 여러 문자열을 가지고 있고, 이를 조건을 주어 문자열을 뽑아내보도록 하자. indexOf( ) 함수 indexOf( ) 함수는 문자열을 실시간으로 검색해주는 기능을 가졌다. 검색 방향은 제일 첫 인덱스부터 시작되며 왼쪽에서 오른쪽으로 향한다. 검색 도중 조건에 만족하는 문자열을 찾지 못했다면 -1 을 return 해준다. 바로 예제 코드를 보도록 하자. 문자열 배열중에 "고"를 가진 문자열을 찾는 코드이다. const arr1 = [ '고구마', '감자', '사탕', '고단백', '고기']; const txt = '고'; //-1은 찾지못했다는 것 -> !== -1 은 찾지 못하지 아니하면(찾았..
[ JavaScript ] 자바스크립트 filter( ) 함수와 find( ) 함수
저번 포스팅에서 배열에서 map( ) 함수로 값을 빼오는 법을 다루었다. 그럼 배열에서 특정 조건만 주어 조건에 해당하는 값들만 걸러내려면 어떻게 해야 할까? 이럴 때 사용하는 것이 주로 filter( ) 함수, find( ) 함수이다. 예제를 보며 이해해보도록 하자. filter( ) 함수 영어 뜻 그대로 배열의 값들 중 특정 조건이 true인 값들을 다 걸러내준다. 아래의 코드를 보자. const arr1 = [10, 20, 30, 40, 50]; //값이 30 이상인 값 구하기 const result1 = arr1.filter(item => item>30); console.log("값이 30 이상인 값 구하기"); console.log(result1); //값이 40 인 값 구하기 const res..
[ JavaScript ] 자바스크립트 map( ) 함수
값을 여러개 가지고 있는 배열에서 모든 값을 꺼내고자 할 때, 꺼내는 방법은 정말 다양하게 알려져 있다. 이번 포스팅에선 이러한 배열에서 값 꺼내는 방법 중 map( ) 을 다뤄보도록 하자. 아래와 같은 배열 arr 이 있다고 가정해 보자. let arr = [ 10, 20, 30, 40, 50 ]; arr 배열의 5 개의 값을 전부 꺼내 콘솔에 찍어보고 싶다면 아래처럼 for 문을 이용한 분들도 많았을 것이다. const arr = [ 10, 20, 30, 40, 50 ]; //기본 for문 방식 console.log("기본 for문"); for(let index = 0 ; index < arr.length ; index++) { console.log(arr[index]); } //향상된 for문 방식..