첫사랑은 아름다워서

심볼(Symbol) 🤔 ES6에서 새로 추가된 원시 타입인 심볼(Symbol)은 변경 불가능 하며, 다른 값과 절대 중복되지 않는 값입니다. 심볼은 Symbol()이라는 함수를 사용해서 만들 수 있습니다. const symbol1 = Symbol('Test'); const symbol2 = Symbol('Test'); console.log(symbol1); // Symbol(Test) console.log(symbol2); // Symbol(Test) console.log(symbol1 === symbol2); // false 심볼은 다른 타입과 달리 리터럴이 아닌, Symbol 함수로 만들 수 있습니다. 언뜻 보면 생성자 함수를 호출해서 객체를 만드는 것처럼 보이지만, 심볼은 변경 불가능한 원시 값이기..

정규 표현식 🤔 정규 표현식(Regular Expression)은 특정한 패턴을 가진 문자열의 집합을 표현하기 위한 문법입니다. 자바스크립트 외에도 많은 프로그래밍 언어들이 지원하고 있으며, 정규 표현식을 활용하여 문자열 내에서 발견한 패턴을 자유롭게 추출하거나 변환할 수 있습니다. 이를 패턴 매칭(Pattern Matching)이라 말합니다. 패턴 매칭 기능을 통해 입력 받은 문자열 내에서 전화번호나 이메일 주소를 찾을 수도 있고, HTML 문서 내에서 찾고자 하는 태그 내의 데이터를 추출하거나 변경할 수도 있습니다. 비록 정규 표현식이 알아보는 것에 있어 실제 문자열과 차이가 있기 때문에 이해하기 어려울 수 있지만, 초반 개념을 잘 이해하면 간편하게 사용할 수 있습니다. regexr.com 사이트에서..

배열 다루기 🔥 저는 자바스크립트로 코딩을 하면서 생각보다 배열을 많이 사용하기 때문에, 이번에는 본문을 통해 배열을 다룰 때 제가 주로 사용하는 방법을 공유해 보려 합니다. 자바스크립트의 배열 메소드에는 부수 효과가 일어나는 것도 있고, 고차 함수라는 개념도 있어서 한 번 제대로 정리해 두면 이후 배열을 사용할 때 많은 도움이 될 것 같습니다. 사실 MDN 같은 공식 가이드에서 소개하는 메소드 위주긴 하지만요 😅 글을 읽기 전 알아 두면 좋은 도메인 지식 두 가지를 먼저 소개합니다. 부수 효과(side effect): 원본 데이터를 변경시키는 효과를 의미합니다. 고차 함수(higher-order function): 함수를 인자로 받거나, 반환하는 함수를 의미합니다. 배열 생성하기 ⚡️ 배열은 기본적으로..

자기 참조 변수 🤔 new 키워드를 통해 생성자를 호출하면, 암묵적으로 자기 자신을 가리키는 this가 제공됩니다. 이러한 용도를 지닌 식별자를 자기 참조 변수(self-referencing variable)라 부릅니다. 자바스크립트에서는 this가 가리키는 값이 호출 방식에 따라 동적으로 결정됩니다. TYI - 바인딩: 식별자와 값(메모리 공간의 주소)을 연결하는 과정을 의미합니다. 함수 호출 방식에 따른 this 바인딩 ✏️ 함수는 다양한 방식으로 호출할 수 있으며, 방식에 따라 this가 가리키는 값이 다릅니다. const foo = function () { console.log(this); }; foo(); // window new foo(); // foo {} const obj = { foo }..

strict mode란? 🤔 코드에서 오타나 문법에 대한 실수는 개발자의 의도와 관계 없는 동작을 일으킬 수 있습니다. 그래서 ES5부터 오류를 방지할 수 있는 환경인 strict mode를 지원하기 시작했습니다. 이로 인해 오류 발생의 여지가 있거나, 자바스크립트 엔진의 최적화에 방해가 될 수 있는 코드에 대해 명시적인 에러를 발생시킵니다. ESLint 같은 정적 분석 도구를 사용해도 비슷한 효과를 얻을 수 있습니다. strict mode는 전역 또는 함수 최상단에 'use strict';를 추가함으로써 적용할 수 있습니다. 'use strict'; function foo() { x = 123; // ReferenceError: x is not defined } foo(); 그리고 strict mode..