본문 바로가기

자바스크립트120

[Javascript] Strict mode 자바스크립트는 1995년도에 개발된 오래된 언어입니다. 현재 2022년까지 무려 27년이 되었습니다. 긴 역사만큼 수많은 문법과 구문들이 자바스크립트에 등장했고, 그 중에서는 현재 사용하면 안정성 혹은 효율을 떨어뜨리는 구문도 존재합니다. 이런 구문들을 피하려면 왜 이 구문이 문제였고, 어떤 방식으로 피할지에 대해 알아야하는데, 이 구문들이 하나둘씩 늘어나다 보니 개발자들에게 부담으로 다가오기 시작했습니다. 그래서 자바스크립트는 Strict mode(엄격 모드)를 지원하기 시작해서 이러한 구문들을 자바스크립트 측에서 발견하여 알려주고, 개발자는 따로 알아두지 않아도 되도록 만들었습니다. 1. Strict mode Strict 모드는 개발자에게 편의성을 주는 모드입니다. 서론에서 언급했듯이, 여러 이유로 .. 2022. 1. 30.
[Javascript] Object 객체 객체들의 객체인 Object 객체에 대해서 알아보겠습니다. 1. Object 객체 Object 객체는 객체에 대한 공통적인 속성과 기능을 제공하는 객체입니다. 다시말해 Object 객체는 객체의 객체라고 할 수 있습니다. 내장형 객체와 사용자 정의 객체도 Object 객체에 포함되어 Object 객체의 기능들을 이용할 수 있습니다. Object 객체는 많은 멤버들을 가지고 있는데, 그 중에서 가장 많이 사용되는 멤버들을 몇 가지 소개하고 넘어가겠습니다. 멤버 설명 constructor 생성자 함수 지정 assign(target, obj, ...) 객체 target에 obj 객체들을 복사 create(prototype) prototype 객체를 기반으로 새 객체 생성 is(value1, value2) va.. 2022. 1. 30.
[Javascript] Closure 1. 스코프 체인 Closure에 대해서 알아보기 전에, 스코프 체인에 대한 개념을 간단하게 짚고 넘어가겠습니다. 자바스크립트는 스크립트가 실행 될 때, 내부적으로 Global 객체를 생성합니다. 이 객체는 인스턴스화하거나 메소드 호출이 불가능한 객체로, 스크립트에서 글로벌 변수/함수를 관리하기 위해 내부적으로 자동 생성되는 객체입니다. 마찬가지로 로컬 변수 또한 글로벌 객체와 유사한 객체로 관리됩니다. 이를 Call 객체(Activation 객체)라고 부르는데, Call 객체는 Global 객체처럼 인스턴스화나 메소드 호출이 불가능하며, 함수가 호출 될 때마다 로컬 변수들을 관리하기 위한 자동 생성 객체입니다. 이렇게 여태까지 몰랐어도 문제가 없었고, 직접 사용할 수도 없는 자동 생성 객체를 왜 굳이 .. 2022. 1. 29.
[Javascript] 명명된 인수 이번에 소개할 방식은 명명된 인수입니다. 명명된 인수는 함수를 호출할 때 이름을 명시할 수 있는 인수를 말합니다. 1. 명명된 인수 명명된 인수는 서론에서 이야기 한 대로 함수를 호출할 때 이름이 명시가능한 인수를 말합니다. 실제 사용예를 보면 다음과 같이 인수를 객체형으로 전달되는 인수들을 명명된 인수라고 이야기합니다. getSum({ num1: 10, num2: 100 }); 그럼 객체 리터럴로 전달하는 명명된 인수에는 어떤 장점이 있길래 사용하는 것 일까요? 명명된 인수는 다음과 같은 장점들을 가집니다. 생략가능한 인수의 표현이 쉽다. 인수의 순서 변경이 쉽다. 인수가 많아도 코드를 해석하기 쉽다. 위의 장점에 따라 명명된 인수는 아래 코드와 같은 표현도 가능합니다. getSum({ num1: 10.. 2022. 1. 15.
[Javascript] function 명령과 Function 명령/함수 리터럴 study-repo를 만들면서 함수에 대한 내용들이 부족하다고 느끼게 되어 2~3개의 포스트에서 함수에 대한 내용을 다시 다뤄보려고 합니다. function 명령과 Function 명령/함수 리터럴은 작동시 동작에서 차이점을 보입니다. 이번 포스트에서는 이들이 어떤식으로 동작하는지 그 차이점을 분석해보려고 합니다. 1. function 명령 우선 function 명령에 대해 알아보겠습니다. function 명령에 의한 함수 선언을 다시 살펴보면 다음과 같습니다. function(인수, ...) { } 다음과 같은 코드를 생각해봅시다. 일반적인 프로그래밍 사고에 따르면 아래의 코드는 에러를 내보내야합니다. 왜냐하면 함수가 먼저 호출되고 그 이후에 선언/정의 되었기 때문입니다. 하지만 실행해보면 정삭적으로 .. 2022. 1. 14.
[Javascript] Proxy 객체 Proxy 객체는 ES2015부터 추가된 객체입니다. 프록시(Proxy)라는 단어의 뜻인 대리, 대신 처럼 무언가를 대신하는 역할을 하는 객체입니다. 1. Proxy 객체 Proxy 객체는 객체의 기본적인 동작의 새로운 동작을 정의할 때 사용하는 객체입니다. 새로운 동작이라는 것은 기존의 객체를 조작하는 행위를 할 때 로그를 찍어준다거나, 객체를 열거할 때 추가적인 가공을 한다거나 하는 식으로 사용자가 제작한 어플리케이션에서 객체의 독자적인 새로운 동작을 정의한다는 것 입니다. 프록시 객체를 이용하면 객체 내부를 건드리지 않고 새로운 동작을 구현할 수 있습니다. 프록시 객체는 다음과 같이 사용합니다. new Proxy(타겟, 핸들러); 타겟은 조작을 추가할 대상 객체, 핸들러는 타깃의 조작을 정의하는 객.. 2022. 1. 14.
300x250