본문 바로가기

Programming/Javascript91

[Javascript] default function parameter default functin parameter, 기본값 함수 매개변수입니다. 이름처럼 매개변수에 기본값을 주는 문법입니다. 1. default functin parameter default functin parameter는 함수의 매개변수에 기본값을 설정하는 문법입니다. 만약 파라미터를 요구하는 함수에 대해서 호출될때 전달된 파라미터가 없거나 undefined전달시 이 기본값을 파라미터로 사용하게 됩니다. 사용법은 파라미터에 기본값을 '='연산자로 지정해주면 됩니다. function(x = 기본값) {}; const add = (x = 1, y = 2) => { return x + y; }; console.log('#1: ' + add(2, 2)); console.log('#2: ' + add(3)); .. 2021. 11. 24.
[Javascript] protected와 private 멤버 예전에 클래스와 프로토타입을 설명할 때 간단하게 설명했었는데, 미흡한거같아서 추가적으로 포스팅하게 되었습니다. 1. protected와 private 멤버 다른 자바계열이나 C계열 언어(자바스크립트도 C계열이지만)의 멤버들에게는 '접근지정자'라고 하는 키워드가 있습니다. public, protected, private 세가지인데요. 이들은 객체 내부의 멤버에 대해서 외부에서 접근할 수 있는 권한을 부여하는 키워드입니다. 우리가 주목해야할 것은 ptrotected와 private인데요. private 멤버는 간단히 말해 클래스, 객체 내부에서만 접근할 수 있고 외부나 상속받은 객체에서는 접근을 불가능하게 만들어주는 요소입니다. 객체는 당연히 외부에서 쉽게 접근을 허용하면 안되기 때문에 일반적으로 대부분의 .. 2021. 11. 24.
자바스크립트의 this 예전에 this를 간단히만 다뤘습니다. 그때는 포스트 성격상 this가 클래스, 프로토타입 개념부터 이용되기 때문에 간단하게 소개했었습니다. 하지만 자바스크립트의 다른언어의 this와 달리 특이하게 사용되고 있으며 자바스크립트의 굉장히 독특한 문법중 하나입니다. 그래서 다시 한 번 this를 알아보려고 합니다. 내용이 별거 없어보이지만 처음 접한다면 보이는 것보다 어렵고 복잡한 키워드이기 때문에 급하신 분들은 주먹구구식으로 하이라이팅된 부분만을 외우시면 됩니다. 물론 코딩에서 외우는 것은 당연히 비추천이기에 나중에 이해가 반드시 수반되어야합니다. 1. this의 단독 사용 우선 this를 따로 혼자서 호출한 경우입니다. 아무것도 없는 상태에서 this만을 호출하면 window를 가리킵니다. const x.. 2021. 11. 12.
[Javascript] Nullish coalescing 연산자 1. 널 병합 연산자 Nullish Coalescing Operator 널 병합 연산자는 ES6 이후로 추가된 새로운 연산자입니다. 번역된 이름으로만 보면 뭔가 굉장히 복잡하고 어려워 보이는 이름인데 실제로는 그렇지 않습니다. Nullish Coalescing Operator는 다음과 같이 ??로 작성합니다. 피연산자 ?? 피연산자 이렇게 작성했을때 ??왼쪽의 피연산자가 'null' 혹은 'undefined'라면 오른쪽의 피연산자를 반환하는 역할을 합니다. 그래서 아래와 같은 코드를 작성했을때 오른쪽의 문자열을 반환하게 됩니다. const nullish = null ?? 'Nullish Coalescing Operator'; console.log(nullish); 2. ||와의 차이 배우고 보니 예전에 .. 2021. 11. 12.
인수와 인자, Argument & Parameter 주변 사람들에게 자바스크립트를 알려주다보면 인수와 인자를 처음 접하는 사람 입장에서 굉장히 헷갈려 하는 사람들이 많았습니다. 예전의 저 또한 두 단어가 차이가 있는건가? 싶었습니다. 그래서 간단하지만 이 둘을 정리하고 넘어가려고 합니다. 인수와 인자의 차이 사실 이건 한자어로 번역하면서 생긴 한국어의 단점이라고 생각합니다. 인수와 인자, 한자어로는 굉장히 비슷한 단어이지만 제목에도 써있듯이 영어로 풀면 Argument와 Parameter, 완전히 다른 단어입니다. 두 용어를 간단히 정의하면 인수는 함수를 호출할 때 건네주는 변수이고, 인자(=매개변수, 파라미터)는 함수에서 정의 되어 사용되는 변수입니다. 짧은 코드로 간단한 예시를 들어보겠습니다. let num = 1; function add10(num).. 2021. 11. 7.
[Javascript] Fetch API Ajax 통신을 이용할 때 지난 포스트에서 다룬 XMLHttpRequest, jQuery, Fetch 등을 사용합니다. 이 중 XHR 방식은 사용법이나 가독성면을 위협하고, 제이쿼리는 사용하지 않는 경향이 있기 때문에 Fetch를 사실상의 표준으로 채택하고 있습니다. 1. Fetch API 지난번에 비동기 통신을 다루는 객체인 XMLHttpRequest 객체를 알아보았습니다. 하지만 사용법이 조금 복잡하고 가독성도 썩 좋다고는 하지는 못한다고 할 수 있습니다. 그래서 이런 문제점을 해결하기위해 ES6부터 통신을 위한 Fetch API를 채택했습니다. Fetch는 브라우저에 내장되어있기 때문에 따로 라이브러리의 설치같은 과정 없이도 이용할 수 있다는 장점이 있습니다. Fetch는 네트워크의 Request와.. 2021. 10. 18.
300x250