es6 4

Array.reduce 여러가지 사용 사례

사례 1 사용: 숫자 합산reduce()의 가장 간단한 사용 사례 중 하나는 여러 숫자를 합산하는 것입니다.정수 배열이 있고 총합을 구하고 싶다고 가정해 보겠습니다.// 반복문 사용const numbers = [1, 2, 3, 4, 5];let sum=0;for(let i=0; iacc+curr, 0);console.log(sum);와우! 코드 한 줄만으로 배열의 모든 요소의 합을 계산했습니다.어큐뮬레이터의 초기 값은 0으로 설정되고 각 반복에서 현재 요소를 어큐뮬레이터에 추가합니다.시작 값을 제외하기로 선택하면 reduce는 배열의 첫 번째 항목만 사용합니다.하지만 저는 항상 초기 값을 포함하는 경향이 있어서 읽기가 더 쉽습니다.사용 사례 2: 배열 평면화여러분은 여러 배열을 보면서 "이걸 하나의 배열..

프로그래밍/Js 2024.08.27

es6 옵셔널 체이닝 에 대해 ?. 샘플 OCP

디자인 패턴의 OCP 를 공부하다 기록해 놓습니다. 아래와 같은 코드가 있습니다. const aa = 't'; if(aa == 't') console.log('ooo'); else consolelog('xxx'); 아주 단순한 코드죠 위 코드를 라우팅 테이블과 라우터로 변경해봅니다. const resultProcess = { table: { "true": () => { console.log('ooo'); }, "false": () => { console.log('xxx'); }, }, router(input) { return this.table[input == 't']?.(input); } }; resultProcess.router('t'); OCP 를 흉내내기 위해서 아주 간단한 코드로 작성했습니다. ..

프로그래밍/Js 2023.08.31

[ES6] 템플릿 메소드 패턴 예제

상속을 이용한 템플릿 메소드 패턴 예제 다형성을 이용하여 load() 메소드 호출시 각각 자식의 _load() 메소드가 호출된다. 다형성 = 내적일관성 + 대체가능성 // 공통 부분 const Order = class { #id; #name; constructor(name) { this.#name = name; } getName() { return this.#name; } load() { const content = "[공통] 부모 > 자식변수 [content]"; this._load(content); // 위임 부분 } _load(v) { throw "override"; } // HOOK } const ord1 = class extends Order { constructor() { super("자식 >..

객체지향 2022.05.09

초보자를 위한 vue 개발 ES6 문법 4개

1. 화살표 함수 // 일반 함수 function(v1, v2) { return v1 + v2 } // 화살표 함수 const test = (v1, v2)=>{ return v1 + v2 } console.log(test(1,2)); // 3 // 화살표 함수 (인자없을때) const test =_=>{ } 2. 템플릿 리터럴 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴입니다. 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있습니다. 이전 버전의 ES2015사양 명세에서는 "template strings" (템플릿 문자열) 라고 불려 왔습니다. ` 백틱을 사용합니다. `string text` const test =_=>{ return `Hello ${this.name} ` } 3. 모듈..

프로그래밍/vue 2021.12.21