[TIL] 2020. 05. 11. Functional_Programming

달밤·2020년 5월 11일
0

TIL

목록 보기
8/110
post-thumbnail

함수형 프로그래밍

1. forEach() 메소드

for 반복문을 forEach()메소드로 대체 가능

let userLoca = [
    { name: 'Soohyun', location: 'Seoul' },
    { name: 'Sihyun', location: 'Ulsan' },
    { name: 'Sehyun', location: 'Busan' }
];

//	원하는 결과(각 element)
//  { name: 'Soohyun', location: 'Seoul' },
//  { name: 'Sihyun', location: 'Ulsan' },
//  { name: 'Sehyun', location: 'Busan' }

- 방법 1. for문 사용

for(let i=0; i<userLoca.length; i++) {
    console.log(userLoca[i]);
}

//  { name: 'Soohyun', location: 'Seoul' },
//  { name: 'Sihyun', location: 'Ulsan' },
//  { name: 'Sehyun', location: 'Busan' }

- 방법 2. forEach() 메소드 사용

function printUserLoca(user) {
    console.log(user);
}

userLoca.forEach(prituserLoca);

//  { name: 'Soohyun', location: 'Seoul' },
//  { name: 'Sihyun', location: 'Ulsan' },
//  { name: 'Sehyun', location: 'Busan' }

2. map() 메소드

지정된 배열에서 원하는 부분을 배열로 추출 (지정된 배열의 길이와 같음 )

let userLoca = [
    { name: 'Soohyun', location: 'Seoul' },
    { name: 'Sihyun', location: 'Ulsan' },
    { name: 'Sehyun', location: 'Busan' }
];

//	원하는 결과(각 엘리먼트에서 name에 해당하는 부분의 배열)
//	[ 'Soohyun', 'Sihyun', 'Sehyun',]

- 방법 1. for문 사용

let userName = [];

for(let i=0; i<userLoca.length; i++){
    userName.push(userLoca[i].name);
}

//	[ 'Soohyun', 'Sihyun', 'Sehyun',]

- 방법 2. forEach() 메소드 사용
let userName = [];

function pushName(user) {
    userName.push(user.name);
}

userLoca.forEach(pushName);

//	[ 'Soohyun', 'Sihyun', 'Sehyun',]

- 방법 3. map() 메소드 사용

function getName(user) {
    return user.name;
}

userLcoa.map(getName);

//	[ 'Soohyun', 'Sihyun', 'Sehyun',]

3. filter() 메소드

지정된 배열에서 조건에 맞는 부분만 배열로 추출

let userLoca = [
    { name: 'Soohyun', location: 'Seoul' },
    { name: 'Sihyun', location: 'Ulsan' },
    { name: 'Sehyun', location: 'Busan' }
];

//원하는 결과(각 엘리먼트 중에서 조건에 맞는 엘리먼트를 포함하는 배열)
//[{ name: 'Soohyun', location: 'Seoul' }]

+ 방법 1 for문 사용
let liveLocation = [];

for(let i=0; i<userLoca.length; i++) {
	if(userLoca[i].location === 'Seoul') {
		liveLocation.push(userLoca[i]);
	}
}
console.log(liveLoation); 	//[{ name: 'Soohyun', location: 'Seoul' }]

+ 방법 2 forEach() 메소드 사용

let liveLocation = [];

function matchLocation(user){
    if(user.location === 'Seoul'){
        liveLocation.push(user);
    }
}

userLoca.forEach(matchLocation);

console.log(liveLoation); 	//[{ name: 'Soohyun', location: 'Seoul' }]

+방법 3 filter() 메소드 사용

function matchLocation(user){
    if(user.location === 'Seoul'){
        return true;
    } else {
        return false;
    }
}

userLoca.filter(matchLocation) 	// [{ name: 'Soohyun', location: 'Seoul' }]

4. reduce() 메소드

원하는 부분을 원하는 형태로 추출

let userLoca = [
    { name: 'Soohyun', location: 'Seoul' },
    { name: 'Sihyun', location: 'Ulsan' },
    { name: 'Sehyun', location: 'Busan' },
    { name: 'Gihyun', location: 'Ulsan' }
];

//원하는 결과(조건에 맞는 엘리먼트를 조합한 객체)
//{Seoul: 1, Ulsan: 2, Busan: 1}

+ 방법 1. for문 사용

let locaInfo = {};
for(let i = 0; i<userLoca.length; i++){
    let loca = userLoca[i].location
    if(!(loca in locaInfo)){
        locaInfo[loca] = 1;
    } else {
        locaInfo[loca] = locaInfo[loca] + 1;
    }
}

console.log(locaInfo); 	//{Seoul: 1, Ulsan: 2, Busan: 1}

+ 방법 2. forEach() 메소드 사용

let locaInfo = {};
function countInfo(user){
    let loca = user.location
    if(!(loca in locaInfo)){
        locaInfo[loca] = 1;
    } else {
        locaInfo[loca] = locaInfo[loca] + 1;
    }    
}
userLoca.forEach(countInfo);
console.log(locaInfo); 	//{Seoul: 1, Ulsan: 2, Busan: 1}

+ 방법 3. reduce() 메소드 사용

function countInfo(acc, curr){
    let loca = curr.location
    if(!(loca in acc)){
        acc[loca] = 1;
    } else {
        acc[loca] = acc[loca] + 1;
    }
    return acc;
}
userLoca.reduce(countInfo, {}); 	//{Seoul: 1, Ulsan: 2, Busan: 1}

오늘 하루

  1. 함수형 프로그래밍 이해하기 너무 어려웠다. 그래도 나름대로 정리해보고 문제도 풀어보니 이제서야 눈에 익는 느낌이다.
  2. 저녁 먹고 자전거 타고 주전까지 다녀왔다. 산 오르다 숨질 뻔. 꾸준히 운동합시다.
  3. 생활코딩 CSS 봐야되는데 게으름으로 아직 보지 못했다. 오늘 배운 것 마저 복습하고, 내일 배울 것 예습하고서 시간이 남을까? ㅠ
profile
다 늦은 밤, 달밤의 개발일기

2개의 댓글

comment-user-thumbnail
2020년 5월 12일

글 너무 좋습니다!
잘 보고 갑니다 가끔 들릴게요!

1개의 답글