Programing/Javascript (5) 썸네일형 리스트형 [JavaScript] 함수 기본 매개변수 (Default Parameters) 사용법 기본 매개변수(Default Parameters)란? 함수에 전달된 매개변수의 값이 undefined이거나 전달된 값이 없을 때, 초기화 설정된 값을 말한다. 사용법 파라미터 뒤에 = 를 붙이고, 그 뒤에 기본으로 설정할 값을 입력하면 된다. function name(param = defaultValue){ ... } 아래 사용 예시를 살펴보자. function sum(a, b) { return a + b; } console.log(sum(1, 2)); // 3 console.log(sum(1)); // NaN 일반적으로 함수 호출 시 정해진 매개변수의 갯수만큼 인자로 넘겨주어야 한다. 위 코드를 보면 sum 이라는 함수의 매개변수는 a와 b 두개이며, sum 호출 시 1개의 인자만 넘겨주면 NaN이 반.. [JavaScript] 전개 연산자(Spread Operator) 사용법 전개 연산자(Spread Operator)란? 전개 구문(Spread Syntax)은 ECMAScript6(2015)에서 새로 추가된 문법으로 이름 그대로 객체 혹은 배열들을 펼칠 수 있게 해 준다. 이때 전개 연산자(...)를 활용한다. 사용법 문법 자체는 정말 간단하다. 배열이나 객체 앞에 점 세 개(...)를 붙여주면 된다. 아래 사용 예시를 살펴보자. 사용예시 : 배열 const arr = [1, 2, 3]; console.log(arr); // [ 1, 2, 3 ] console.log(...arr); // 1 2 3 실행결과 [ 1, 2, 3 ] 1 2 3 실행결과를 살펴보면 첫번째 줄은 배열 자체 그대로 출력이 되지만, 전개 연산자를 사용한 두번째 줄은 배열 안의 요소들이 펼쳐져서 출력된 걸.. [JavaScript] 데이터 타입 확인 - typeof 연산자 사용법 typeof 연산자란? typeof는 변수의 데이터 타입을 반환하는 연산자이다. 문법 typeof operand typeof(operand) typeof 연산자는 데이터 타입을 확인해야 하는 피연산자 앞에 위치한다. 물론 괄호도 사용 가능하지만, 불필요한 괄호를 넣은 사용방법이니 추천하지는 않는다. 반환되는 값은 다음과 같다. undefined : 변수가 정의되지 않거나 값이 할당되지 않은 경우 number : 숫자인 경우 string : 문자열인 경우 boolean : true or false인 경우 object : 함수, 배열 등 객체인 경우, null 인 경우 function : 함수인 경우 symbol : 심볼인 경우 이를 표로 정리하면 다음과 같다. 표현식 반환값 typeof undefined .. [JavaScript] 템플릿 리터럴(Template Literals)이란? 템플릿 리터럴(Template Literals) ES6는 템플릿 리터럴(Template literal)이라고 불리는 새로운 문자열 표기법을 도입하였다. 템플릿 리터럴은 내장된 표현식을 허용하는 문자열 리터럴이다. 일반 문자열과 비슷해 보이지만, ‘ 또는 “ 같은 통상적인 따옴표 문자 대신 백틱 문자(`)를 사용한다. 템플릿 리터럴의 기능 1. Expression interpolation (표현식 삽입법 ) 백틱 사이에 ${ } 를 이용하여 변수나 연산 등을 삽입할 수 있게 되었다. 아래 예시를 보자. 기존 ES6 이전에는 따옴표(',")와 + 연산자를 이용하여 작성하였고, 변수 사이 + 를 넣어주는 불편한 방식이었다. const num1 = 1; const num2 = 2; const msg = num1.. [JavaScript] var 를 사용하지 않는 이유 var var는 ES6 등장 이전에 변수를 선언할 때 사용되던 키워드다. 하지만 ES6 등장 이후 let과 const를 사용하고, var는 큰 단점이 있어 현재 잘 사용하지 않는다. 그래서 오래된 소스들을 보면 대부분 var로 선언되어 있는 모습을 볼 수 있다.... 그럼 어떤 단점이 있는지 알아볼까? 먼저 아래 코드를 보면 변수 num 이 중복으로 선언되어 있다. 그러나 이를 오류로 판단하지 않고 정상 동작한다. var num = 123; var num = 456; console.log(num); 실행결과 : 456 만약 소스코드가 길어지고 큰 프로젝트를 진행하게 될 경우, 해당 문제로 인한 오류를 찾기가 매우 힘들어진다. 그런데, 왜 이런 현상이 나타날까? 그 이유는 바로 Hoisting(호이스팅) .. 이전 1 다음