개발자의 공부방/Frontend
-
자바스크립트에서 기본 함수의 파라미터를 어떻게 정의하는지 알아보자. function calcCircleArea(r) { const radius = r || 1; return Math.PI * radius * radius; } const area = calcCircleArea(); console.log(area) 위의 코드는 함수 안에 파라미터가 없을 때 기본 값을 1로 지정하게끔 하는 코드이다. 아래는 기본 값을 지정하는 방법의 또 다른 방법이다. //1. function calcCircleArea(r = 1) { const radius = r || 1; return Math.PI * radius * radius; } const area = calcCircleArea(); console.log(area)..
javascript] 함수의 기본파라미터자바스크립트에서 기본 함수의 파라미터를 어떻게 정의하는지 알아보자. function calcCircleArea(r) { const radius = r || 1; return Math.PI * radius * radius; } const area = calcCircleArea(); console.log(area) 위의 코드는 함수 안에 파라미터가 없을 때 기본 값을 1로 지정하게끔 하는 코드이다. 아래는 기본 값을 지정하는 방법의 또 다른 방법이다. //1. function calcCircleArea(r = 1) { const radius = r || 1; return Math.PI * radius * radius; } const area = calcCircleArea(); console.log(area)..
2021.12.16 -
논리연산자를 이용해서 코드를 더 짧게 사용하는 것을 말한다. 전에 있던 Truthy한 값과 Falsy한 값에서 좀 더 나아가보자. const dog = { name: '멍멍이' } function getName(animal) { // 1번째 코드 if(animal) { return animal.name; } return undefined; //----------------------------------- // 2번째 코드 return animal && animal.name } const name = getName(dog); console.log(name) 위의 코드에 1번과 2번은 같은 결과를 내준다. 2번 코드가 어떻게 1번과 같을까? 앞에 부분이 true가 되면 뒤의 값이 오게 된다. 아래의 코드를..
javascript] 단축평가 논리계산법.논리연산자를 이용해서 코드를 더 짧게 사용하는 것을 말한다. 전에 있던 Truthy한 값과 Falsy한 값에서 좀 더 나아가보자. const dog = { name: '멍멍이' } function getName(animal) { // 1번째 코드 if(animal) { return animal.name; } return undefined; //----------------------------------- // 2번째 코드 return animal && animal.name } const name = getName(dog); console.log(name) 위의 코드에 1번과 2번은 같은 결과를 내준다. 2번 코드가 어떻게 1번과 같을까? 앞에 부분이 true가 되면 뒤의 값이 오게 된다. 아래의 코드를..
2021.12.15 -
자바스크립트에는 Truthy한 값과 Falsy한 값이 있다. 이 두가지에 대해서 알아보자! 1. Falsy한 값. console.log(!undefined); console.log(!null); console.log(!0); console.log(!''); console.log(!NaN); console.log(!false); 기본적으로 위의 나열된 값은 false가 default값이다. 여기에 ! 느낌표를 덧붙임으로 반전을 했기 때문에 콘솔로그에서는 true가 나오게 된다. ※참고로 NaN은 Not a Number를 의미한다. const value = 1 / 'foo'; console.log(value); >> 결과 : NaN 2. Truthy한 값. console.log(!3); console.log..
javascript] Truthy와 Falsy자바스크립트에는 Truthy한 값과 Falsy한 값이 있다. 이 두가지에 대해서 알아보자! 1. Falsy한 값. console.log(!undefined); console.log(!null); console.log(!0); console.log(!''); console.log(!NaN); console.log(!false); 기본적으로 위의 나열된 값은 false가 default값이다. 여기에 ! 느낌표를 덧붙임으로 반전을 했기 때문에 콘솔로그에서는 true가 나오게 된다. ※참고로 NaN은 Not a Number를 의미한다. const value = 1 / 'foo'; console.log(value); >> 결과 : NaN 2. Truthy한 값. console.log(!3); console.log..
2021.12.15 -
ES6에서 property shorthand, 단축 속성명이라는게 있다. 즉, key와 value의 값이 같으면 각각 표기하지않고 한번만 표기하는 것을 말한다. 아래는 vuex에서 사용되는 코드이나 기반은 javascript라서 예제로 사용해본다. commit('ADD_TOAST') 라는 함수 아래 message와 type 속성들이 있다. 이 부분은 key, value값이 동일하기때문에 생략이 가능하다. actions: { triggerToast({ commit }, message, type = 'success') { // commit('UPDATE_TOAST_MESSAGE', message); // commit('UPDATE_TOAST_ALERT_TYPE', type); // commit('UPDATE..
javascript] property shorthand란?ES6에서 property shorthand, 단축 속성명이라는게 있다. 즉, key와 value의 값이 같으면 각각 표기하지않고 한번만 표기하는 것을 말한다. 아래는 vuex에서 사용되는 코드이나 기반은 javascript라서 예제로 사용해본다. commit('ADD_TOAST') 라는 함수 아래 message와 type 속성들이 있다. 이 부분은 key, value값이 동일하기때문에 생략이 가능하다. actions: { triggerToast({ commit }, message, type = 'success') { // commit('UPDATE_TOAST_MESSAGE', message); // commit('UPDATE_TOAST_ALERT_TYPE', type); // commit('UPDATE..
2021.12.06 -
src 뒤, require함수안에 주소가 @로 시작한다. 이것은 최종경로를 나타내는 것으로 현재 디렉토리까지의 경로를 말한다.
vue] vue.js 경로 '@' 의미src 뒤, require함수안에 주소가 @로 시작한다. 이것은 최종경로를 나타내는 것으로 현재 디렉토리까지의 경로를 말한다.
2021.11.29