전체 글787

• 

  [JavaScript]Map 객체 Map 객체는 ECMAScript 6부터 도입된 JavaScript 객체입니다. Map 객체는 [키, 값] 형태의 값을 가지는 객체입니다. 키는 Map 객체에서 고유해야 하며, 값은 변경 가능합니다. 이번 포스팅에서는 Map 객체의 사용 방법을 정리합니다. 목차 Map 객체 생성 방법 Object와 Map 비교 Map 객체 다루기(요소의 개수, 추가, 삭제) Map 객체의 요소를 반복문으로 접근하기 Map 객체 생성 방법 빈 Map 객체를 생성합니다. var mapObject = new Map(); [키, 값] 형태의 중첩 배열을 전달하여 Map 객체를 생성하는 방법입니다. var mapObject = new Map([ ['A', 'valueA'], ['B', 'valueB'], ['C', 'valueC.. JavaScript/JavaScript 문법 2021. 8. 17.

• 

  [JavaScript]배열에서 특정 조건을 만족하는지 체크하는 some 함수 JavaScript에서 some 함수는 배열의 요소를 순차적으로 순회하면서 특정 조건을 만족하는지 체크합니다. 만족하는 요소가 하나라도 있을 경우 true를 그 외에는 false를 반환합니다. 목차 some 함수 구문 및 매개변수 some 함수의 특징 배열 요소에서 10보다 큰 값이 있는지 체크 callback 함수를 화살표 함수로 사용 some 함수 구문 및 매개변수 arr.some(callback(element, index, array), thisArg) arr - 순회하고자 하는 배열 element - 현재 배열의 요소 index(생략 가능) - 현재 배열 요소의 index array(생략 가능) - some 함수를 호출한 배열 thisArg(생략 가능) - callback 함수를 실행할 때, th.. JavaScript/JavaScript 문법 2021. 8. 17.

• 

  [JavaScript]변수 선언과 호이스팅(Hoisting) JavaScript의 변수 선언 방법과 호이스팅(Hoisting) 개념에 대해 정리합니다. 변수 선언 방법과 호이스팅은 간단한 개념이지만, 이번 기회에 정확하게 정리하고자 합니다. 목차 변수 선언 방법 전역 변수와 함수 내부의 지역 번수 이름이 동일 호이스팅(Hoisting) 변수 선언 방법 JavaScript에서는 변수를 var 키워드를 이용하여 선언할 수 있습니다. (let과 const 키워드는 추후 정리할 예정입니다.) 변수마다 var 키워드를 사용하여 변수를 선언할 수 있습니다. var value; var name; 콤마( , )를 사용하여 한 줄로 선언할 수도 있습니다. var value, name; 그리고 변수 선언과 동시에 초기화를 할 수도 있습니다. var languane = 'Korean.. JavaScript/JavaScript 문법 2021. 8. 17.

• 

  [JavaScript]현재 날짜 구하기, yyyymmddhhmmss포메팅 JavaScript에서 날짜와 시간을 나타내는 Date 객체 사용 방법을 정리합니다. 목차 Date 객체 생성하기 Date 객체에서 날짜 정보 가져오기 문자열 변환 함수 및 yyyymmddhhmmss 포메팅 몇 년, 몇 월, 며칠 전후 Date 객체 생성하기 매개변수가 없으면, 생성 시점의 날짜로 Date 객체를 생성합니다. // 현재 날짜 var nowDate = new Date(); console.log(nowDate); // Mon Aug 16 2021 18:17:28 GMT+0900 (한국 표준시) // 년, 월, 일을 전달한 값으로 셋팅 // 2021년 1월 1일의 Date객체 생성 var date1 = new Date(2021, 0, 1); console.log(date1); // Fri Ja.. JavaScript/JavaScript 문법 2021. 8. 16.

• 

  [JavaScript]함수형 프로그래밍 - 합성(composition) 앞에서 설명한 내용들을 기반으로 필요한 기능 및 로직을 순수 함수로 나누어 개발합니다. 이렇게 나누어진 순수 함수들을 합쳐야 하는 경우가 존재합니다. 예를 들어 A 함수를 실행 후 B 함수를 실행하거나 또는 A 함수를 실행 후 C 함수를 실행해야 하는 경우 (A, B), (A, C)처럼 함수를 조합하는 과정이 필요합니다. 이러한 과정을 함수 합성(function composition)이라고 합니다. 이번 포스팅에서는 함수 합성의 내용을 정리합니다. 메서드 체이닝도 합성의 일부다. 메서드 체이닝을 사용하면, 이전에 호출한 함수의 결과에 다음 함수를 호출할 수 있습니다. 아래 코드는 replace 함수를 사용하여 문자열을 변경하고 변경된 문자열에 또 replace 함수를 사용하는 코드입니다. 따라서, 메서드.. JavaScript/함수형 프로그래밍 2021. 8. 15.

• 

  [JavaScript]함수형 프로그래밍 - 재귀(Recursion) 재귀(recursion) 함수는 자기 자신을 호출하는 함수를 말합니다. for문과 같은 반복문은 재귀로 변환할 수 있으며, 재귀로 코드를 작성하는 방법이 더 효율적일 수도 있습니다. 이번 포스팅에서는 반복문을 재귀 함수로 변경하는 코드를 기반으로 재귀에 대한 내용을 정리합니다. 재귀에 대한 개념 및 이론적인 설명은 하지 않으며, 함수형 프로그래밍과 연관 지어 설명합니다. 배열의 합계를 재귀 함수로 작성 반복문을 사용하여 5부터 0까지의 합계를 반환하는 코드입니다. var totalValue = function(param) { var sum = 0; for(var loop = param; loop > 0; loop--) { sum += loop; } return sum; } console.log(total.. JavaScript/함수형 프로그래밍 2021. 8. 15.

• 

  [JavaScript]함수형 프로그래밍 - 고차 함수 함수형 프로그래밍에서 고차 함수(high order function) 통칭 HOF가 존재합니다. 고차 함수는 다른 함수를 인자로 받거나 또는 함수를 반환하거나 방금 말한 두 가지를 모두 수행하는 함수입니다. 이번 포스팅에서는 고차 함수에 대해 정리합니다. 다른 함수를 인자로 받음 다른 함수를 인자로 받는 함수는 Array.map, Array.filter, Array.reduce와 같은 함수들이 존재합니다. 즉, 위 3개의 함수는 고차 함수입니다. filter 함수를 예로 설명합니다. 아래 코드는 배열의 요소에서 'Korean'이 아닌 요소들을 모아서 새로운 배열을 반환합니다. var language = [ 'Korean', 'English', 'German' ]; var filterArr = langua.. JavaScript/함수형 프로그래밍 2021. 8. 14.

• 

  [JavaScript]함수형 프로그래밍 - 데이터 변환 함수형 프로그래밍에서 순수 함수의 요건을 다시 한번 정리해봅시다. 1. 파라미터를 최소 하나 이상 받으며 파라미터에 의해서만 반환 값이 결정됩니다. 2. 값이나 다른 함수를 반환합니다. 3. 부수 효과가 없어야 합니다. 4. 입출력을 수행해서는 안 됩니다. 즉, 순수 함수는 함수 외부의 값을 변경하지 않아야 하고 값을 반환해야 합니다. 대부분 자바스크립트 개발자들은 기존의 값을 변경하지 않고 새로운 값을 반환하는 순수 함수를 많이 사용해왔습니다. 다만, 그 함수들을 함수형 프로그래밍의 개념과 순수 함수와 관련지어서 생각을 못 했을 뿐이죠. 대표적으로 Array.map 함수와 Array.reduce 함수가 존재합니다. 이번 포스팅에서는 배열에서 지원하는 함수들을 사용하여 어떻게 새로운 값을 반환하는지 정리.. JavaScript/함수형 프로그래밍 2021. 8. 14.

• 

  직장인 남자 5개월만에 10kg 감량(홍보 및 광고글 아님) 개인적인 글이라 편의상 반말로 작성하고 인증 사진이 많다. 나는 운동 피지컬은 눈곱만큼 존재하지도 않았고 운동 경험은 군대가 전부다. 약팔이 글 아니고 홍보성 글도 아니고 식단 조절도 안 했고 헬스장도 안 다닌다. 운동기구는 운동 매트리스, 푸쉬업바, 손목 보호대가 끝이다. 다이어트 목적으로 운동한 것도 아니다. 근데, 나는 어떻게 5개월 만에 10kg를 뺄 수 있었을까? 계기는 단순했다. 그냥 이렇게 계속 살면 안 될 거 같아서 곧 있으면 30살인데, 거울에 비친 내 모습이 너무 한심해 보여서 내 겉모습부터 바꾸기로 결심했다. 내 키는 170cm이고 몸무게는 건강검진 기록을 토대로 작성한다. 2019년 07월 04일 69.2kg 2020년 09월 28일 68.9kg 운동을 언제 시작한 지 정확한 기록은.. 일상 2021. 8. 14.

• 

  [JavaScript]배열에서 최댓값(max), 최솟값(min) 구하기 JavaScript에서 배열의 최댓값(max), 최솟값(min)을 구하는 방법을 정리합니다. 배열에서 최댓값, 최솟값을 구하는 방법은 반복문을 사용하여 구할 수 있으며, 숫자인 경우에는 JavaScript에서 지원하는 Math.max()와 Math.min()을 사용하여 구할 수 있습니다. 단, Math.max()와 Math.min() 함수는 숫자만 가능하기에 제한적입니다. 문자열의 최댓값, 최솟값을 구하고 싶다면, 배열의 프로퍼티 함수인 reduce 함수를 사용하거나 또는 sort 함수를 사용하여 정렬 후 첫 번째 인덱스와 마지막 인덱스의 값을 구하는 방법도 존재합니다. 목차 반복문을 사용하여 최댓값, 최솟값 구하기 Math.max와 Math.min 함수 사용하여 최댓값, 최솟값 구하기 reduce 함수.. JavaScript/배열 2021. 8. 13.

• 

  [ECMAScript]Set 객체 Set 객체는 ECMAScript 6부터 도입된 JavaScript 객체입니다. Set 객체를 간단하게 설명하자면, 고유한 값을 가지는 객체입니다. 중복 값을 가지지 않고 정렬되지 않은 상태로 생성됩니다. 이번 포스팅에서는 Set 객체의 사용 방법을 정리합니다. 목차 Set 객체 생성 방법 Set 객체 다루기(요소의 개수, 추가, 삭제) Set 객체의 요소를 반복문으로 접근하기 부분집합, 합집합, 교집합, 차집합 Set 객체 생성 방법 빈 Set 객체를 생성합니다. var setObject = new Set(); iterableObject(순회할 수 있는 객체)를 전달하여 Set 객체를 생성하는 방법입니다. 중복되는 값을 가지는 배열을 전달하여 중복 값을 가지지 않은 Set 객체를 생성합니다. var s.. JavaScript/JavaScript 문법 2021. 8. 13.

• 

  [JavaScript]배열에서 중복값 제거하는 방법 JavaScript에서 배열의 중복 값을 제거하는 방법을 정리합니다. 목차 Set 객체와 spread 연산자 사용 filter 함수와 indexOf 함수 사용 filter 함수와 hasOwnProperty 함수 사용 sort 함수와 filter 함수 사용 sort 함수와 reduce 함수 사용 Set 객체와 spread 연산자 사용 Set 객체는 고유한 값을 가지는 객체입니다. Set 객체를 생성하여 중복 값이 없는 객체를 생성하고 spread( ... ) 연산자를 사용하여 Set 객체를 배열로 변환합니다. var arr = [1, 2, 3, 4, 5, 1, 2, 3, 4, 5]; var setObj = new Set(arr); console.log(setObj); var setArr = [...setO.. JavaScript/배열 2021. 8. 11.