"# JavaScript 30" 강의 - 04. Array Cardio Day 1
학습일자
2020.09.29
학습내용
- Array method 정리
: www.tcpschool.com/javascript/js_standard_arrayMethod
코딩교육 티씨피스쿨
4차산업혁명, 코딩교육, 소프트웨어교육, 코딩기초, SW코딩, 기초코딩부터 자바 파이썬 등
tcpschool.com
- .sort(a, b)
: 원리는 a와 b를 비교해서 a가 크면, +, b가 크면 -, 똑같으면 0을 반환하며, array 내 모든 item을 돌면서 비교해서 정렬하는 방식임
: 문자인 경우는 sort()로 바로 적용가능하고, 숫자인 경우 a-b 의 차이를 반환하여 정렬가능
: dudmy.net/javascript/2015/11/16/javascript-sort/
자바스크립트 정렬 함수, sort() - Dudmy's DevLog
자바스크립트 배열의 내장 함수에 sort()가 있다. 명칭 그대로 배열 안의 원소를 정렬하는 함수이다. 추후에 또 검색할 것 같아서 적어놓는다. arrayobj.sort(sortFunction) arrayobj는 임의의 Array 개체이
dudmy.net
- .map()
: 1대1로 짝짓되, 기존 객체를 수정하지 않고 새로운 객체를 생성
: 배열에서 2개씩 item을 뽑아서 각각 다른 작업해서 하나로 합치는 작업 수행 (1cycle)
- .reduce((이전값or 누적값, item) => { }, 초기값)
: reduce는 두 개의 인자를 받아 하나로 줄인다는 의미에서 reduce임
: 최종 반환 값은 string, integer, array, object가 될 수도 있음
: 초기값으로부터 하나씩 돌면서 바구니에 담는 식으로 누적값을 생성 및 리턴
: 배열에서 각 원소의 개수를 계산 or 총 누적 합산 값을 구할 때 사용
: www.zerocho.com/category/JavaScript/post/5acafb05f24445001b8d796d
(JavaScript) map, reduce 활용하기 - 함수형 프로그래밍
안녕하세요. 이번 시간에는 map과 reduce 메서드에 대해 알아보겠습니다. 배열에 있는 바로 그 map과 reduce 맞습니다. 많은 분들이 forEach는 사용하시는데 map과 reduce는 잘 안 쓰시더라고요. 그리고 redu
www.zerocho.com
[JS #3] 자바스크립트 배열 메서드 3, reduce 100% 활용법 (feat. egghead.io)
이번 글에서는 Javascript array method 에피소드의 마지막, reduce 에 대해 적어보려고 합니다. 앞선 글들에서 이미 forEach, map, 그리고 filter, reject, every, some 를 다루었지만, reduce…
medium.com
- .textContent
: 해당 node 및 하위 node의 모든 텍스트 값을 반환
: www.w3schools.com/jsref/prop_node_textcontent.asp
HTML DOM textContent Property
HTML DOM textContent Property Element Object Example Get the text content of an element: var x = document.getElementById("myBtn").textContent; The result of x will be: Try it Yourself » --> Try it Yourself » More "Try it Yourself" examples below. Definit
www.w3schools.com
-.includes
: 해당 문자가 포함되는지 여부를 반환(true/false)
: www.w3schools.com/jsref/jsref_includes_array.asp
JavaScript Array includes() Method
JavaScript Array includes() Method Example Check if an array includes "Mango": var fruits = ["Banana", "Orange", "Apple", "Mango"]; var n = fruits.includes("Mango"); The result of n will be: true --> Try it Yourself » Definition and Usage The includes() m
www.w3schools.com
알게된 점
- console.table(result) 식으로 출력하면, 객체 형태의 데이터를 표로 깔끔하게 콘솔창에 표시할 수 있음
- map( ) 과 reduce( )가 가장 강력한 method라고 표현하는 개발자들이 많음 (아직 공감은 안됨)
- 동일 array에 대한 다른 method를 수행할 때는 .부터 이어서 연속해서 기재할 수 있음 (하기 코드 참조)
- 함수 내에서 다른 변수 선언 등과 함께 연산 결과를 반환시키는 경우에는 반드시 'return'을 넣어 함수가 종료되고 정확한 반환값이 무엇인지를 지정해야 함(실수 많음)
const transportation = data.reduce(function (obj, item) {
console.log(obj);
if (!obj[item]) {
obj[item] = 0;
}
obj[item]++;
//여기서 key:value, car: 2 식으로 반환됨
return obj;
}, {});
