개발나라 스용공주

이번 글은 비동기 작업에서 Promise를 더 직관적이고 편하게 사용할 수 있게 도와주는 async와 await의 활용에 대한 글이다.아래 링크는 이 블로그의 다른 비동기 작업에 대한 글이다.https://hwangseoyoung.tistory.com/197 [JavaScript] 비동기 작업 - setTimeout(), 콜백함수이번 글은 비동기 함수의 작동원리와 비동기 작업 시 사용되는 setTimeout()과 콜백함수에 대한 글이다.   [ 동기와 비동기 ]동기는 여러 작업을 순서대로 한번에 하나씩 처리하는 것이고 JavaScripthwangseoyoung.tistory.comhttps://hwangseoyoung.tistory.com/198 [JavaScript] 비동기 작업 - promise(),..

이번 글은 비동기 작업에서 사용되는 promise, then, catch에 대한 글이다.비동기 작업에 대한 설명글은 아래 링크를 참고하면 된다.https://hwangseoyoung.tistory.com/197 [JavaScript] 비동기 작업 - setTimeout(), 콜백함수이번 글은 비동기 함수의 작동원리와 비동기 작업 시 사용되는 setTimeout()과 콜백함수에 대한 글이다.   [ 동기와 비동기 ]동기는 여러 작업을 순서대로 한번에 하나씩 처리하는 것이고 JavaScripthwangseoyoung.tistory.com  [ 객체 promise ]promise는 객체로 비동기 작업을 효율적으로 처리하도록 도와주는 JS의 내장 객체이다.비동기 작업의 성공하거나 실패한 결과값을 이용할 수 있다..

이번 글은 비동기 함수의 작동원리와 비동기 작업 시 사용되는 setTimeout()과 콜백함수에 대한 글이다.   [ 동기와 비동기 ]동기는 여러 작업을 순서대로 한번에 하나씩 처리하는 것이고 JavaScript의 일반적인 실행 구조이다.비동기는 여러개의 작업이 주어졌을 때 앞선 작업이 종료되지 않아도 기다릴 필요 없이 다른 작업을 실행하는 것으로 setTimeout()등의 내장함수를 통해 실행할 수 있다.    [ setTimeout함수 ]비동기 구조로 실행하는 역할을 하는 setTimeout()은 인수로 받은 시간만큼 대기 한 후 콜백함수를 실행하는 형태이다.코드를 일정 시간 이후 비동기적으로 실행하는 역할을 한다.setTimeout(콜백함수, 시간) 아래 코드와 코드의 실행결과를 보면 setTime..

이번 글은 배열과 객체 안의 값을 순회하는 여러가지 방법에 대한 글이다   [ 배열 순회 ]아래 코드와 같이 배열이 있을 경우 각각의 값에 하나하나 도달하는 배열의 순회 방법 2가지를 알아볼 것이다.let arr = [1, 2, 3]; 방법 1) for문for (let i = 0; i  방법 2) for of - 배열에서만 사용가능한 반복문for (let item of arr) { console.log(item);}    [ 객체 순회 ]아래 코드와 같이 객체가 있을 때 객체의 키와 값에 하나하나 도달하는 방법 3가지를 알아볼 것이다.let person = { name: "황서영", age: 24,};  방법 1) Object.keys - 객체에서 key 값들만 뽑아 새로운 배열로 반환하는 ..

이번 글은 Spread와 Rest에 대한 글이다.   [ Spread 연산자 ]Spread는 객체나 배열에 저장된 여러 개의 값을 개별로 흩뿌려주는 역할을 한다.배열에서 사용하는 경우 형태는 아래 코드와 같이 배열명 앞에 ...을 붙여준다.그 후 출력되는 것을 보면 arr1과 arr2가 합쳐진 것을 확인할 수 있다.let arr1 = [1, 2, 3];let arr2 = [4, ...arr1, 5];console.log(arr2); 객체도 마찬가지로 객체명 앞에 ...을 붙여주는 형태이고 객체 obj1과 객체 obj2가 합쳐진 것을 확인할 수 있다.let obj1 = { a: 1, b: 2,};let obj2 = { ...obj1, C: 3,};console.log(obj2);    [ Rest ..

이번 글은 배열과 객체의 구조분해할당에 대한 글이다.   [ 배열의 구조분해할당 ]배열의 구조분해할당은 함수에 여러 개의 인수를 전달할 때 사용된다. 아래 예제의 형태라면 one에 1, two에 2, three에 3이 할당되는데 변수 four는 할당되는 값 없이 남게 된다.그럼 변수 four는 undefined로 출력된다.let arr = [1, 2, 3];let [one, two, three, four] = arr; 남는 변수는 이런식으로 기본 값을 설정해줄 수 있다.let [one, two, three, four=4] = arr;   [ 객체의 구조분해할당 ]객체의 구조분해할당이란 아래 예제와 같다.할당되지 않은 변수 extra는 undefined로 출력되는 것을 확인할 수 있다.name이라는 키 이..

이번 글은 단락 평가에 대한 글이다. [ 단락평가란? ]단락 평가란 조건문을 이용하지 않고도 어떠한 함수를 호출하지 않도록 방지해주거나 어떤 값을 계산하지 않도록 제한해주는 것이다.단락 평가의 구조는 첫번째 피연산자의 값만 이용해 연산의 결과를 확정할 수 있다면 두번째 피연산자에 접근하지 않는다.  [ &&(and)와 ||(or) ]단락 평가를 이해하기 위해선 논리연산자 &&(and)와 ||(or)를 먼저 이해해야한다. 1) &&(and)true와 true => truetrue와 fasle => falsefalse와 true => falsefalse와 false = > false2) ||(or)true와 true => truetrue와 false => truefalse와 true => truefalse와..

이번 글은 Truthy와 Falsy에 대한 글이다.  [ Falsy한 값 ]상황에 따라 꼭 bool형이 아니더라도 참과 거짓으로 판명되는 경우가 있다.거짓으로 판명되는 Falsy한 값은 다음과 같다.undefinednull0-0NaN""0n 아래 코드는 Falsy한 값의 예시로 조건문에서 거짓으로 판명된다.조건문은 f1이 거짓일 경우 해당 코드를 출력하는 코드이다.let f1 = undefined;if(!f1) { console.log("f1은 거짓입니다.");}      [ Truthy한 값 ]Truthy한 값은 위의 7가지 Falsy한 값을 제외한 나머지 모든 값으로 활용 예제는 아래와 같다.아래 코드를 보면 Truthy와 Falsy를 활용하면 직접 undefined이나 null 같은 조건을 달아주지..