본문 바로가기

Javascript90

52. reduce Method 안녕하세요. 박기린 입니다. Array의 메소드인 reduce()에 대해 알아보겠습니다. Array.prototype.reduce() const movements = [200, 450, -400, 3000, -650, -130, 70, 1300]; const balance = movements.reduce(function(acc, cur, i, arr) { console.log(`Iteration ${i}: ${acc}`); return acc + cur; }, 0); console.log(balance); // 3840 Array이름.reduce( 콜백함수, 콜백함수에 들어갈 acc의 초기값 ); 만약 초기값을 설정하지 않는다면, Array의 첫 번째 element를 초기값으로 삼습니다. -> 콜백함수.. 2022. 12. 16.
51. filter Method 안녕하세요. 박기린 입니다. Array의 메소드인 filter()에 대해 알아보겠습니다. Array.prototype.filter() const movements = [200, 450, -400, 3000, -650, -130, 70, 1300]; const deposits = movements.filter(function (mov, i, arr) { return mov > 0; }); console.log(movements); console.log(deposits); const withdrawals = movements.filter(mov => mov 콜백함수 구성 function( 배열의 요소가 .. 2022. 12. 15.
50. map Method 안녕하세요. 박기린 입니다. 저번에 소개해드린 forEach()에 이어서, forEach()와 유사하지만 조금 다른 Array 메소드인 map()에 대해 알아보겠습니다. Array.prototype.map() const movements = [200, 450, -400, 3000, -650, -130, 70, 1300]; const eurToUsd = 1.1; const movementsUSD = movements.map(mov => mov * eurToUsd); console.log(movementsUSD); Array이름.map( 콜백함수 ); map() 메소드는 콜백함수를 인수로 받습니다. 그리고 Array의 모든 elements에 반복을 돌면서, 콜백함수가 각 element 마다 실행되게 끔 합니.. 2022. 12. 14.
[JS] 49. forEach Method 안녕하세요. 박기린 입니다. for-of문에 이어서, 이번엔 forEach 문에 대해 알아보도록 하겠습니다. for-of 문이었을 때 const movements = [200, 450, -400, 3000, -650, -130, 70, 1300]; for (const movement of movements) { if (movement > 0) { console.log(`You deposited ${movement}`); } else { console.log(`You withdrew ${movement}`); } } movements 라는 Array가 있습니다. 양수일 경우 예금을, 0 또는 음수일 경우 출금으로 인식하는 코드입니다. for-of문의 경우 위처럼 사용합니다. movement라는 변수에 배열.. 2022. 12. 9.
48. Array의 기본 메소드 part.2 (slice, splice, reverse, concat, join, at) Array 내장메소드 part 1. https://arnopark.tistory.com/549 part 2. https://arnopark.tistory.com/499 안녕하세요. 박기린 입니다. 이전에 설명한 Array의 기본 메소드 part.1에 이어서, 자주 사용되는 Array의 내장메소드를 추가로 설명하겠습니다. Array.prototype.slice() let arr = ['a', 'b', 'c', 'd', 'e']; arr.slice(2); // c d e arr.slice(2, 4); // c d arr.slice(-2); // d e arr.slice(1, -2); // b c arr.slice() // a b c d e 2022. 12. 7.
47. IIFE 함수 안녕하세요. 박기린 입니다. 이번엔 'IIFE - Immediately Invoked Function Expressions' 에 대해 알아보겠습니다. 평범한 함수 const runOnce = function () { console.log('This will never run again'); }; runOnce(); 일반적인 함수는 이렇게 생겼습니다. 일단 함수를 선언한 후, 함수를 호출해서 사용합니다. IIFE - 즉시 실행 함수 표현 (function ( ) { console.log('This will never run again'); const isPrivate = 23; })(); console.log(isPrivate); // Undefined IIFE는 함수를 괄호로 묶어서 즉시 호출시킵니다. .. 2022. 12. 2.
46. Bind Method 안녕하세요. 박기린 입니다. 저번에 call()과 apply()에 대해서 알아봤습니다. 이번에는 call(), apply()처럼 함수 내 this 키워드를 지정해주는 내장함수인 'bind()'에 대해 알아보겠습니다. Function.prototype.bind() 우선 book이라는 함수를 선언해줍니다. function book(flightNum, name) { console.log( `${name} booked a seat on ${this.airline} flight ${this.iataCode}${flightNum}` ); this.bookings.push({ flight: `${this.iataCode}${flightNum}`, name }); }; book 함수는 전역 범위에서 선언된 함수이지만,.. 2022. 11. 30.
45. Call and Apply Methods 안녕하세요. 박기린 입니다. 이번에는 Obejct의 메소드가 아닌 함수에서도 this 키워드를 사용할 수 있게 해주는 내장함수인 call()과 apply()에 대해 알아보겠습니다. (메소드와 this 키워드에 대한 설명이 있는 글 : https://arnopark.tistory.com/501) 일반적인 Method 함수와 this 키워드 const lufthansa = { airline: 'Lufthansa', iataCode: 'LH', bookings: [], book(flightNum, name) { console.log( `${name} booked a seat on ${this.airline} flight ${this.iataCode}${flightNum}` ); this.bookings.pus.. 2022. 11. 29.
44. Callback Functions (일급함수, 고차함수) 안녕하세요. 박기린 입니다. 이번에는 Callback(콜백) 함수에 대해 알아보겠습니다. 우선 콜백함수를 알기 전에, First-Class Functions와 Higher-Order Functions의 개념을 알아둬야 합니다. First-Class Functions (일급 함수) function sayHello() { return "Hello, "; } function greeting(helloMessage, name) { console.log(helloMessage() + name); } // Pass `sayHello` as an argument to `greeting` function greeting(sayHello, "JavaScript!"); // Hello, JavaScript! // 코드 출.. 2022. 11. 28.