ss__jae2
타닥타닥 IT
ss__jae2
전체 방문자
오늘
어제

Github

  • 타닥타닥 IT (179)
    • 웹개발 (86)
      • JAVA (23)
      • DBMS (6)
      • HTML (9)
      • CSS (7)
      • JavaScript (12)
      • JSP (14)
      • Spring (15)
    • FrontEnd (63)
      • HTML (5)
      • CSS (12)
      • JavaScript (16)
      • React.js (14)
      • Node.js (16)
    • API (5)
    • SQLD (21)
      • SQLD (1)
      • 1과목 데이터 모델링의 이해 (11)
      • 2과목 SQL 기본 및 활용 (9)
    • CS Study (4)
      • 네트워크 (4)

공지사항

최근 댓글

최근 글

반응형
hELLO · Designed By 정상우.
ss__jae2

타닥타닥 IT

FrontEnd/JavaScript

[JavaScript] JavaScript 함수형 프로그래밍

2022. 10. 6. 23:59
반응형

1. 함수형 프로그래밍

  • Simple is the Best!
  • 즉, 기능 동작을 위해 간단하고, 간결하고, 간소하게 작성하는 방법론
  • 함수형 프로그래밍은 객체지향 프로그래밍과 비교되는 방법론으로 객체지향 프로그래밍에 비해 더 간결하고, 더 예측 가능하고, 더 테스트하기 쉬운 경향이 있다.
  • 단, 이 장점들이 단순히 함수형 프로그래밍이 객체지향 프로그래밍에 비해 더 쉽다는 것은 아니다.

2. 함수형 프로그래밍의 3대 개념

① 순수 함수(Pure Function)

② 불변성(Immutable state)

③ 1급 객체(First-class)

3. 순수 함수(Pure Function)

- 같은 입력 값이라면, 항상 같은 결과 값을 반환한다.

- 외부적인 것에 영향을 받지 않는다.

- 예측이 가능해야 한다.

<script>
	// 순수 함수 예
	function func(a, b) {
		return a + b;
	}

	// 순수하지 않은 함수 예
	let c = 1;

	function func(a, b) {
		return a + b + c;
	}
</script>

4. 불변성(Immutable state)

- 객체가 생성된 이후 그 상태를 변경할 수 없는 것을 의미

- 즉, 객체를 생성 후 의도치 않은 동작에 의해 값을 변경하지 않도록 하는 것

- 값을 변경할 수 없다는 것과 재할당은 다른 것

<script>
	var new_coke = coke;		// 변형이 됨
	var new_coke = {...coke};	// 불변성이 유지됨(clone)
    					// 클론 카피해서 새로 하나 만들거야({...coke})

	// 불변성이 유지되지 않은 예
	// 나는 coke만 바꿔줬지만 의도치 않게 new_coke도 name이 바뀌게 됨
	var coke = {
		name: 'coca',
		price: 2980
	}

	// coke와 new_coke는 둘 다 같은 곳을 바라보기 때문에 하나만 수정해도 다 바뀜
	var new_coke = coke;
	coke.name = "pepsi";
	console.log(coke.name, new_coke.name);	// 'pepsi', 'pepsi'

	// 불변성을 유지하는 예
	var coke = {
		name: 'coca',
		price: 2980
	}
	
	// 클론 카피를 해서 독립된 공간으로 되기 때문에 수정해도 다 바뀌지 않음
	var new_coke = {...coke};	
	coke.name = "pepsi";
	console.log(coke.name, new_coke.name);	// 'pepsi', 'coca'
</script>

5. 1급 객체(First class)

- 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가르킴

반응형
저작자표시 (새창열림)

'FrontEnd > JavaScript' 카테고리의 다른 글

[JavaScript] JavaScript HTML template  (0) 2022.10.07
[JavaScript] DOM 노드 읽기, 탐색, 추가, 삭제  (0) 2022.10.06
[JavaScript] 문서 객체 모델(DOM)  (0) 2022.10.05
[JavaScript] JavaScript Array 객체  (0) 2022.10.04
[JavaScript] typeof / instanceof, String 객체  (1) 2022.09.30
    'FrontEnd/JavaScript' 카테고리의 다른 글
    • [JavaScript] JavaScript HTML template
    • [JavaScript] DOM 노드 읽기, 탐색, 추가, 삭제
    • [JavaScript] 문서 객체 모델(DOM)
    • [JavaScript] JavaScript Array 객체
    ss__jae2
    ss__jae2

    티스토리툴바