본문 바로가기

전체 글

(68)
[Javascript] Symbol What is Symbol? 자바스크립트엔 총 7 가지 원시 타입이 존재합니다. (string, number ,boolean , null, undefined, bigint , symbol) 얼마없는 타입의 하나의 좌를 차지하는 주제에 좀처럼 안보이는 녀석이기도 합니다. (제 생각이지만) 실제로 토이 프로젝트 레벨 정도의 프로젝트면 크게 효용을 못느낄것 같습니다. Symbol is a built-in object whose constructor returns a symbol primitive — also called a Symbol value or just a Symbol — that's guaranteed to be unique.-MDN 쉽게 말해서, 유니크한 값을 보장합니다. Symbol을 선언하는 순..
[Javascript] Prototype (프로토타입) JavaScript는 흔히프로토타입 기반 언어(prototype-based language)라 불립니다.— 모든 객체들이 메소드와 속성들을 상속 받기 위한 템플릿으로써 프로토타입 객체(prototype object)를 가진다는 의미입니다. 프로토타입 객체도 또 다시 상위 프로토타입 객체로부터 메소드와 속성을 상속 받을 수도 있고 그 상위 프로토타입 객체도 마찬가지입니다. 이를프로토타입 체인(prototype chain)이라 부르며 다른 객체에 정의된 메소드와 속성을 한 객체에서 사용할 수 있도록 하는 근간입니다. - MDN Why Prototype? 이전 글들에서 말했다시피, 자바스크립트는 오직 원시타입과 객체 타입밖에 존재 하지 않습니다. 그렇기에, 다른 언어들과 달리 inheritance(상속)을 이..
[Javascript] Closure (클로져) What is Closure? A closure is the combination of a function bundled together (enclosed) with references to its surrounding state (the lexical environment). In other words, a closure gives you access to an outer function's scope from an inner function - MDN 클로져란 개념이 일급함수로 인해 파생되기 때문에, 자바스크립트를 처음 접하는 개발자들 중 상당수가 이 개념을 낯설어 합니다. 사실 자연스럽게 사용하고 있지만, 인지 못하는걸 수 있습니다. MDN의 정의에 따르면, 클로져가 내부함수에서 외부함수로의 접근을..
[Javascript] Factory function (팩토리 함수) Factory function이란? A factory function is a function that returns a new object. 말 그대로 '객체'를 반환하는 함수 입니다. 이렇게만 들으면, 정말 별것 아닌것 같지만, 자바스크립트는 일급 함수를 지원한다는 점과 결부되어, 여러가지 재밌는 일들이 가능합니다. 예시를 보면서 설명드리겠습니다. function createUser(lang){ return function (msg){ console.log(`user from ${lang}: ${msg}`) } } // javascript에서 function은 객체이므로 위 함수는 factory 함수입니다. const koreanUserSpeaks = createUser('Korea'); korean..
[Javascript] IIFE(즉시 실행 함수 표현) 즉시 실행 함수 표현(IIFE, Immediately Invoked Function Expression)**은 정의되자마자 즉시 실행되는 Javascript Function - MDN (function () { statements })(); 간혹 여러 프레임워크나 모듈 내부 구경하다보면 위와 같은 형태의 함수들을 보셨을겁니다. 위와 같은 함수 호출을 IIFE라고 부르는데, 어떻게 가능한지, 왜 쓰는지 그동안 의문이었는데, 이번 글을 통해 한번 알아보고자 합니다. Function Declaration 먼저 자바스크립트에서 함수를 어떻게 선언하고 사용하는지 알아봅시다. 1. 함수 선언식(Function Statement) -> 실행 newYear(2023) // 'Hello 2023 function newY..
[Javascript] function overloading(함수 오버로딩) What is Function Overloading? An overloaded function is really just a set of different functions that happen to have the same name 설명을 번역하자면, 이름만 같고 다른 함수들의 집합이라고 되어있는데, 다른 프로그래밍 언어를 경험해보셨다면 굉장히 많이 보셨을터이니, 아마 예시를 보시면 쉽게 이해되실 겁니다. #include using namespace std; void add(int a, int b) { cout
[Javascript] Argument 와 spread 연산자(...) Argument arguments is an Array-like object accessible inside functions that contains the values of the arguments passed to that function. - MDN 함수의 인자값이 거기서 거기지 뭐 그리 특별할게 있나 생각할 수 있는데, 다른 프로그래밍 언어 대비, 독특한 특성에 대해 나열해 보겠습니다. 1. 항상 옵셔널 합니다. function SayHi(a,b){ console.log('Hi ',a,b); } SayHi() // Hi undefined undefined 선언 시, 파라미터를 지정해 줘도, 호출 시, 사용여부는 사용자에게 달려있습니다. 단, 호출 시, 인수를 제공하지 않더라도, 선언된 파라미터에..
[Javascript] 함수(Function) JS에서 함수란? 1. 자바스크립트에서 함수는 특수한 형태의 오브젝트입니다. 이게 대체 무슨 헛소리냐고 생각하시겠지만, JS경험이 조금 있으시다면 몇몇 예시를 보시면 알아채실겁니다.(추후에) 먼저 자바스크립트에서 오브젝트는 3가지로 구성될 수 있습니다. 1. Primitive value : 원시 자료형( string, number, bigint , boolean , undefined , symbol , null) 2. Object value : 오브젝트의 key pair로 또 하나의 오브젝트를 갖는 형태 3. Method : value가 function인 경우 여기서 함수는 2가지를 추가로 가질 수 있습니다. 1. name(optional) : 함수의 이름입니다, 이 프로퍼티를 통해서, 함수를 invok..