본문 바로가기
728x90

Frontend/Javascript22

[JavaScript] 고차 함수 (Higher-Order Function) 고차 함수(Higher-Order Function)이란 함수를 인자로 받거나 함수를 반환하는 함수입니다. 먼저 알아두어야 할 것은 자바스크립트가 선언형 프로그래밍로 분류되는 함수형 프로그래밍(Functional Programming)이라는 것입니다. 함수형 프로그래밍에서는 함수를 1급 시민(First-Class Citizen)으로 인식한다고 설명되는데, 1급 객체로 인식하고 있다는 뜻이 됩니다. 이는 함수를 다음과 같이 변수에도 할당하는 것을 가능하게 합니다. const square_func = function(x) { return x * x; } square(5); // Output : 25 이러한 특징을 통해 함수를 인자로 받거나 함수를 반환하는 함수인 고차 함수가 정의될 수 있습니다. 이번 글에서는.. 2023. 9. 7.
[JavaScript] 화살표 함수 (Arrow Function) 화살표 함수 (Arrow Function Expression)는 기존의 함수 선언식에서 function 키워드가 생략함과 동시에 더 간소화한 형태의 함수 선언입니다. 화살표 함수의 사용 가능한 구문은 다음과 같습니다. () => expression param => expression (param) => expression (param1, paramN) => expression () => { statements } param => { statements } (param1, paramN) => { statements } 형식을 화살표 (=>) 기준으로 나눈다면, 화살표의 좌항은 매개변수를, 우항에는 함수로 사용될 표현식이나 statement“s”들이 들어가게 됩니다. 좌항에서 매개변수가 만약 한 개라면 소괄.. 2023. 9. 6.
[JavaScript] 즉시 실행 함수 (IIFE) IIFE는 Immediately Invoked Function Expression의 약자로, 정의가 되는 순간 바로 실행이 되는 함수인 즉시 실행 함수를 뜻합니다. IIFE의 구문은 다음과 같습니다. (function (exParameter) { // content })(exArgument); ((exParameter) => { // content })(exArgument); 구문을 크게 두 부분으로 나눌 수 있는데, 1) 함수의 정의를 감싸는 소괄호와 2) 끝에 붙어 있는 소괄호입니다. 1) 첫 번째 부분은 익명인 함수의 정의가 들어가게 됩니다. 이때, function 연산자나 화살표 함수를 사용할 수 있습니다. 함수의 정의를 괄호로 묶어주는 이유는 함수 선언문이 아닌, 함수 표현식으로 만들기 위해서입.. 2023. 9. 4.
[JavaScript] 프로토타입 (Prototype) 자바스크립트에서 만들어지는 객체는 프로토타입(Prototype)이라는 속성이 모두 내장되어 있습니다. 어떠한 프로토타입을 가지면, 그 프로토타입의 속성과 메서드를 상속받게 됩니다. 간단한 예시로 강아지라는 객체는 동물이라는 프로토타입을 가지고 있다고 가정한다면, 동물 객체가 가지는 속성과 메서드를 강아지 객체가 상속받아서 사용할 수 있게 됩니다. 프로토타입을 사용함으로써 같은 코드를 재사용할 수 있게 되어 효율성과 코드 가독성을 높일 수 있습니다. 또한, 여러 개의 객체를 생성할 때 같은 프로토타입에서 속성과 메서드를 불러오기 때문에 메모리도 아낄 수 있습니다. 앞서 모든 객체가 프로토타입을 가진다고 언급했는데, 프로토타입도 객체이기 때문에 프로토타입 자체도 프로토타입을 가지게 됩니다. 이것을 프로토타입.. 2023. 8. 20.
[JavaScript] splice()와 slice() 메서드 정리 이번 글에서는 자바스크립트에서 배열을 변경할 수 있는 메서드들인 splice()와 slice()에 대해서 알려드리겠습니다. 우선, splice() 메서드는 배열에 요소를 추가, 교체, 또는 기존의 요소를 삭제할 수 있게 합니다. 메서드의 구문은 다음과 같습니다. exArr.splice(startIndex) exArr.splice(startIndex, deleteCount) exArr.splice(startIndex, deleteCount, item0, item1, ..., itemN) ▶ startIndex (필수) 첫 번째 매개변수는 배열의 변경이 시작되는 위치를 지정합니다. 다른 선택적인 매개변수와는 달리 필수이기 때문에, 만약 생략된다면 배열은 그대로 유지됩니다. - startIndex >= exA.. 2023. 8. 17.
[JavaScript] 난수 생성하기 - Math.random() Math.random() 메서드는 0 이상 1미만의 부동소수점의 난수를 생성합니다. 난수 생성에 사용되는 시드 값은 난수 생성 알고리즘에 의해 결정되기 때문에, 특정 값으로 지정하거나 변경이 불가능합니다. ※ 주의 : Math.random() 메서드는 보안 상 안전한 난수를 제공하지는 않습니다. 보안/암호와 관련되어서는 사용하지 않는 것이 권장됩니다. Math.random() 메서드의 사용 방법 자체는 간단합니다. Math.random() // 0.5834082844933923 Math.random() // 0.4934202120749698 메서드를 활용하면 다양한 유형의 랜덤 숫자를 구할 수 있습니다. 1) 두 값 사이의 랜덤 숫자 추출 아래 예시의 코드는 min 이상 max 미만의 구간에서 랜덤한 숫.. 2023. 8. 9.
반응형