분류 전체보기(310)
-
[Javascript] 콜백 함수
콜백(Callback) 함수. 간단히 말하면 파라미터로 함수 객체를 전달해서 호출 함수 내에서 파라미터로 전달된 함수를 실행하는 것을 말한다.예를 들어 아래 코드와 같이 sayHello() 함수를 호출할때 파라미터와 문자열과 printing 함수 자체를 전달하는 것. 그리고 sayHello()가 실행되면 실행문 안에서 함수가 담긴 두 번째 파라미터 callback 을 괄호()를 붙여 호출한다.function sayHello(name, callback) { const words = '안녕하세요 저는 ' + name + '입니다.'; callback(words); // 파라미터의 함수(콜백 함수) 호출}sayHello("아오금", function printing(name) { console..
2025.05.23 -
[Javascript] 화살표 함수(arrow function)
자바스크립트에서 함수를 만들 때에는 function 키워드를 사용하여 정의할 수 있다. 예를 들어 두 수의 합을 구하는 함수는 다음과 같이 작성할 수 있다.function sum(a, b) { return a + b;} 그리고 ES6부터는 화살표 함수(arrow function)라는 새로운 문법으로 함수를 만들 수 있게 되었다. 화살표 함수는 => 기호를 사용하여 function 키워드를 생략할 수 있다. 따라서 위의 함수를 화살표 함수로 바꾸면 아래와 같이 구성할 수 있게 된다.let sum = (a, b) => { return a + b;}// 만약 함수가 단순한 return문만 있다면 한 줄로 더 심플하게 줄일 수 있다.const sum = (a, b) => a + b; 화살표 함수 문법 표..
2025.05.22 -
[Javascript] 함수의 기본 파라미터
이번 글에서는 함수의 기본 파라미터를 설정하는 방법에 대해 알아보려 한다.한 번 우리가 원의 넓이를 구하는 함수를 만들어 본다고 가정해 보자. function calculateCircleArea(r) { return Math.PI * r * r;}const area = calculateCircleArea(4);console.log(area); // 50.26548245743669 여기서 Math.PI는 원주율 파이(π)의 값을 가리킨다. 그런데 여기서 만약 우리가 이 함수에 r이라는 인자 값을 넘겨주지 않는다면 어떤 결과가 나타날까? function calculateCircleArea(r) { return Math.PI * r * r;}const area = calculateCircleArea();c..
2025.05.21 -
[Javascript] 함수 표현식 vs 함수 선언문
자바스크립트는 함수를 특별한 종류의 값으로 취급한다. 여느 다른 언어들에서처럼 '어떠한 동작을 하는 구조' 정도로 취급하지 않는다는 얘기다. 스크립트를 작성하다 보면 유사한 동작을 하는 코드가 여러 곳에서 필요할 때가 많다. 사용자가 로그인이나 로그아웃을 했을 때 안내 메시지를 보여주는 동작 같은 경우 등등. 함수는 프로그램을 구성하는 주요 구성 요소이다. 함수를 이용하면 중복 없이 유사한 동작을 하는 코드를 여러 번 호출할 수 있다. 함수 선언문(Function Declarations) 일반적인 프로그래밍 언어에서의 함수 선언과 비슷한 형식이다. 함수명이 정의되어 있고 별도의 할당 명령이 없는 것. 함수 선언식은 자바스크립트에서 가장 기본적인 함수 정의 방식으로 함수 이름을 명시적으로 제공해야 한다..
2025.05.20 -
[Javascript] ECMAScript 2015(ES6)+ (2)
구조분해할당(Destructuring) 자바스크립트 개발을 하다 보면 객체를 함수끼리 주고 받는 상황이 아주 많다. 그로 인해 전달 받은 객체의 프로퍼티를 변수로 선언하려면 각 프로퍼티를 별도의 변수로 할당하기 위해 각 프로퍼티마다 독립된 할당문을 작성해야 했다. 하지만 구조분해할당이라고 불리는 문법이 추가되어 변수 선언이 훨씬 더 편리해졌고 코드가 간결해졌다. 변수 선언 먼저 변수의 프로퍼티를 쉽게 선언하는 예제이다. 객체의 구조분해할당은 변수로 선언하고자 하는 객체의 프로퍼티명을 { } 안에 나열하면 각 프로퍼티의 이름으로 변수가 생성되고 프로퍼티의 값이 자동으로 할당된다. 배열의 구조분해할당 또한 비슷한데 [ ] 안에 나열하는 변수의 이름에 맞는 인덱스의 요소가 변수의 값으로 할당된다. ES5fu..
2025.05.20 -
[Javascript] ECMAScript 2015(ES6)+ (1)
ECMAScript(ES6나 ES2015의 ES는 ECMAScript의 줄임말)는 Ecma 인터내셔널에서 정의한 ECMA-262 기술 규격에 정의된 표준 스크립트 프로그래밍 언어다. ECMAScript는 1997년 1판 배포 이후로 매년 2, 3판이 배포되었고 그 뒤 10년 뒤에 5판(ECMAScript 5. 이하 ES5), 다시 6년 뒤인 2015년에 6판(ECMA2015)이 배포되었다(4판은 버려짐). 6판의 정식 명칭은 ECMAScript 6이 아닌 ECMAScript 2015(이하 ES6)이다. 이전에는 배포 주기가 길었지만 빠르게 변화하는 개발 환경을 반영하여 숫자 대신 연도를 붙여 배포되는 추세이다. ES6에서는 ES5 이하 명서에서 문제가 되었던 부분들이 해결되었고, 기존 코드를 더 간결하게..
2025.05.19