javascript 6

자바스크립트 비동기 처리에 대해

👉 동기와 비동기 동기 요청을 보낸 후 응답을 받아야지만 다음 동작이 이루어지는 방식이다. 모든 일이 순차적으로 실행된다. 비동기 요청을 보낸 순서와 상관없이 또 다른 동작이 요청하고 이루어지는 방식이다. 모든 일이 병렬적으로 실행된다. 👉 Callback과 Promise, Async & Await Callback 나중에 호출할 함수이다. 함수를 중첩적으로 사용하게 되면 콜백 헬이 발생하여 가독성이 떨어진다. Promise 동작 후에 어떤 종류의 결과가 반환됨을 약속해주는 Object이다. ES6부터 콜백의 단점을 보완했다. 실행이 성공하면 resolve를 반환, 실패하면 reject를 반환하여 결과를 알려준다. then과 catch를 사용하여 접근이 가능하다. Async & Await 기존 비동기 처리..

CS 2022.06.24

자바스크립트 배열 메서드 3: reduce

1. [ ] . reduce(( 누적값, 현잿값, 인덱스, 요소 ) => { return 결과 }, 초깃값 ) reduce는 이전값이 아닌 누적값을 사용하는 것을 주의해야합니다. 기본적인 사용법은 아래와 같습니다. oneTwoThree=[1,2,3] result = oneTwoThree.reduce((acc, cur, i) => { console.log(acc, cur, i); return acc + cur; }, 0); // 0 1 0 // 1 2 1 // 3 3 2 result; // 6 acc(누적값) 이 초기값인 0부터 시작해서 return 하는대로 누적되는 것을 볼 수 있습니다. 초깃값을 적어주지 않으면 자동으로 초기값이 0번째 인덱스의 값이 됩니다. oneTwoThree=[1,2,3] resu..

JS 2022.03.29

자바스크립트 배열 메서드 2: map

map은 forEach와 마찬가지로 Array의 각 요소를 순회하며 callback 함수를 실행합니다. 다만 callback에서 return 되는 값을 배열로 만들어냅니다. 1. [ ] . map ( callback ) const arr = [0,1,2,3]; let squaredArr = arr.map(function(element){ return element * element; }); // 혹은 arrow 함수 가능 squaredArr = arr.map(element => element * element); console.log(squaredArr); // [ 0, 1, 4, 9 ] 위 코드를 보면 배열속 요소들이 제곱되어 새로운 배열이 생성되는 모습입니다. 2. callback 함수 인자 cons..

JS 2022.03.29

자바스크립트 배열 메서드 1: forEach

forEach는 for문과 마찬가지로 반복적인 기능을 수행할 때 사용합니다. 하지만 for문처럼 index와 조건식, 증감을 정의하지 않아도 callback 함수를 통해 기능을 수행할 수 있습니다. 1. forEach(callback) 기본적인 사용법은 아래와 같습니다. const arr = [0,1,2,3,4,5,6,7,8,9,10]; arr.forEach(function(element){ console.log(element); // 0 1 2 3 4 5 6 7 8 9 10 }); // 혹은 arrow 함수 가능 arr.forEach(element => console.log(element)); arr 객체의 요소들이 callback 함수를 통해 순서대로 호출되는 모습입니다. 2. callback 함수 ..

JS 2022.03.29

클로저 (Closure) 란?

클로저란? 클로저는 내부 함수가 정의 될 때 외부 함수의 환경을 기억하고 있는 내부 함수를 말합니다. 외부 함수안에서 선언된 내부함수는 그 외부 함수의 지역변수나 함수에 접근하여 사용 할 수 있습니다. 클로저 예시 function outter() { // 외부 함수 var data = 1; function inner() { // 내부 함수 return data; } return inner(); } outter 함수 안에는 지역변수 data와 내부 함수 inner가 선언 되어있고 inner 함수는 지역변수 data를 반환하고 있습니다. 클로저 함수 호출 var func = outter(); console.log(func); outter 함수의 반환 값은 inner 함수입니다. inner 함수를 호출해 보았..

JS 2022.03.29

호이스팅이란?

의미 javascript에서 호이스팅이란 인터프리터가 변수와 함수의 메모리 공간을 선언 전에 미리 할당하는 것을 의미합니다. 하지만 모두 할당하는 것이 아닌 var로 선언한 변수만 호이스팅시 undefined로 초기화합니다 예제 함수의 코드를 실행하기전에 함수 선언에 대한 메모리부터 할당합니다 덕분에 함수를 호출하는 코드를 함수선언보다 앞서 배치할수있습니다. 예를 들어 function catName(name) { console.log("제 고양이의 이름은 " + name + "입니다"); } catName("호랑이"); /* 결과: "제 고양이의 이름은 호랑이입니다" */ 위의 코드 조각이 일반적이라면 함수 호출을 먼저했을때를 보겠습니다. catName("클로이"); function catName(nam..

JS 2022.03.24