Front End/Javascript (53) 썸네일형 리스트형 [JavaScript] 순수 함수 & 비 순수 함수 & 고차함수 순수함수: 어떤 외부상태에 의존하지도 않고 변경하지도 않는, 부수효과가 없는 함수비순수함수: 외부상태에 의존하거나 외부상태를 변경하는, 부수효과가 있는 함수자바스크립트는 주로 객체지향 프로그래밍과 함수형 프로그래밍으로 나뉘는데 객체가 기본이 되는 프로그래밍을 객체지향 프로그래밍이라고 하고, 함수형 프로그래밍은 말 그대로 함수가 기본이 되는 프로그래밍을 의미합니다. 함수형 프로그래밍은 프로그래밍 패러다임 중 하나로, 순수 함수와 불변성을 강조하며, 프로그램의 상태 변경을 최소화하는 것을 목표로 합니다. 함수형 프로그래밍은 수학적 함수의 개념에 기반을 두고 있으며, 이를 통해 코드의 간결성, 모듈성 및 예측 가능성을 높일 수 있습니다.순수 함수는 어떤 외부 상태에 의존하지도 않고 변경하지도 않는, 즉 부수 .. [JavaScript] 일급 객체 & 일급 함수 일급 객체(First Class Object) & 일급 함수(First Class Function)컴퓨터 프로그래밍 언어 디자인에서, 일급 객체(first-class object)란 다른 객체들에 일반적으로 적용 가능한 연산을 모두 지원하는 객체를 가리킨다. 보통 함수에 인자로 넘기기, 수정하기, 변수에 대입하기와 같은 연산을 지원할 때 일급 객체라고 한다.https://ko.wikipedia.org/wiki/일급_객체 과연 어떠한 객체 혹은 함수에게 "일급"이라는 표현을 사용하는가? 다음의 특정 조건을 만족하는 객체들을 일급 객체라고 합니다. 일급 객체의 특성1. 무명의 리터럴로 표현이 가능해야 합니다.2. 변수나 자료 구조(객체, 배열 등)에 저장할 수 있어야 합니다.3. 함수의 매개변수에 전달할 수.. [JavaScript] let 키워드 ES6에 추가된 변수 선언 방법입니다. 중복 선언이 불가능 합니다.함수 범위 스코프 입니다. let_ex01.html 파일을 다음과 같이 만듭니다.123456789101112131415161718192021222324252627282930!DOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>let 키워드/title> script> // 구분선을 그려주는 함수 선언 let line = () => console.log('-'.repeat(50)); let user_n.. [JavaScript] var의 문제점 자밥스크립트에서 ES6가 출현하기 전에는 변수를 선언시 var 예약어 선언이 지배했습니다.그러나 var로 선언된 변수와 관련된 문제가 있습니다. 그렇기 때문에 변수를 선언하는 새로운 방법이 등장해야 했습니다.ES6 에서 변수선언에 사용되는 let, const 예약어를 배우기 전에 이전의 변수 선언의 문제점을 보도록 하겠습니다. 1. 중복 선언이 가능합니다. // var를 이용하면 한번 정의된 변수를 재정의 할 수 있습니다. var i = 1; console.log(`i = ${i}`); var i = 2; // 오류가 오류가 아닙니다. console.log(`i = ${i}`); 2. 상수라고 대문자로 선언해도 변경이 가능합니다. .. [JavaScript] 화살표 함수(Arrow Function) 전통적인 자바스크립트에서 함수를 만들 때는 function 키워드를 사용하여 정의할 수 있습니다. 예를들어 두 수의 합을 구하는 함수는 다음과 같이 작성할 수 있습니다. function add1(x, y){ return x + y; } let add2 = function(x, y){ return x + y; } ES6부터는 화살표 함수(arrow function)라는 새로운 문법 방식으로 함수를 만들 수 있게 되었습니다. 화살표 함수는 => 기호를 사용하여 function 키워드를 생략할 수 있습니다.function f(){} 를 const f = () => {};게 표현이 가능합니다.단순한 리.. [JavaScript] 템플릿 리터럴(Template literals) 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴입니다. 여러 줄로 이뤄진 문자열과 문자 보간기능을 사용할 수 있습니다. 이전 버전의 ES2015사양 명세에서는 "template strings" (템플릿 문자열) 라고 불려 왔습니다. 템플릿 리터럴은 이중 따옴표 나 작은 따옴표 대신 백틱(` `) 을 이용합니다. 여러줄의 문자열 사용하기예전에는 여러 줄의 내용을 입력하려면 newline characters(\n)를 사용하여 입력하거나 +(문자열 결합 연산자)를 이용하여 사용했었습니다.let multiLine1= "첫번째줄\n두번째줄\n세번째줄";let multiLine2 = "첫번째줄\n";multiLine2 += "두번째줄\n";multiLine2 += "세번째줄\n"; 하지만 템플릿 문자열을.. [JavaScript] Spread Operator(전개 연산자) 함수에서 사용 함수의 파라미터 부분에서도 비구조화 할당을 사용할 수 있습니다. 이러한 문법은 특히 API 응답 값을 처리하는데에 유용하게 사용됩니다. spread_ex10.html 파일을 다음과 같이 만듭니다.12345678910111213141516171819202122232425262728293031323334353637383940414243!DOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>전개 연산자 함수에서 사용/title> script> function showUser({name, age, .. [JavaScript] Spread Operator(전개 연산자) 객체의 결합/복사 객체에 대해서도 같이 적용이 됩니다. 다음의 예제를 참조해 보세요 객체의 복사spread_ex08.html 파일을 다음과 같이 만듭니다.123456789101112131415161718192021222324252627282930313233343536373839404142!DOCTYPE html>html lang="ko">head> meta charset="UTF-8"> meta name="viewport" content="width=device-width, initial-scale=1.0"> title>객체의 복사/title> script> let kimc = { name:"김종서", age:33, gender:true, .. 이전 1 ··· 3 4 5 6 7 다음
