본문 바로가기

반응형

JavaScript

(14)
[ JavaScript ] 함수와 클로저(Closure) ... 커링을 곁들인 함수 자바스크립트에서 함수는 일급 객체로 취급한다. 일급 객체란 생성, 대입, 인자 또는 반환값으로서의 전달 등 프로그래밍 언어의 기본적인 조작을 제한없이 사용할 수 있는 대상을 의미한다. 쉽게 말해서 모든 기능을 몰빵한 것으로 생각하면 된다. 일급 객체는 자바스크립트만의 특성은 아니고 다른 언어에서도 나타나는 특성이다. 아래의 조건을 만족하면 일급 객체로 간주한다. 1. 무명의 리터럴로 표현이 가능하다. (익명함수) 2. 변수나 자료 구조(객체, 배열 등)에 저장할 수 있다. 3. 함수의 매개변수에 전달할 수 있다. 4. 반환값으로 사용할 수 있다. // 1. 무명의 리터럴로 표현이 가능하다. // 2. 변수나 자료 구조에 저장할 수 있다. var increase = function (num) { re..
[ JavaScript ] 실행 컨텍스트 이 글은 'Deep Dive'를 보고 정리한 글이다. 실행 컨텍스트를 직접 설명하려니 글이 너무 안 써져서 책의 표현을 많이 빌려 썼다. 문제가 되면 글을 삭제하도록 하겠다. 링크 걸어놓은 사이트를 가면 훨씬 설명이 잘 되어 있으니 참고하길 바란다. 실행 컨텍스트란? 실행 컨텍스트는 소스코드를 실행하는 데 필요한 환경을 제공하고 코드의 실행 결과를 실제로 관리하는 영역이다. 실행 컨텍스트는 식별자(변수, 함수, 클래스 등의 이름)를 등록하고 관리하는 내부 메커니즘으로, 모든 코드는 실행 컨텍스트를 통해 실행되고 관리된다. 말이 좀 어렵지만 정말 쉽게 말하면 실행 컨텍스트는 소스코드 내의 모든 변수와 함수의 참조 관계를 도식화한 지도로 생각하면 된다. 자바스크립트 엔진은 소스코드 실행에 앞서 소스코드의 '..
[ JavaScript ] 스코프와 호이스팅(feat. var let const) 1. 스코프 (Scope) 스코프는 참조 대상 식별자(변수)를 찾아내기 위한 규칙이다. 자바스크립트 엔진은 스코프 규칙에 따라 변수를 찾아 쓴다. 위 문장이 스코프의 일반적인 정의다. 변수는 선언 위치에 의해 스코프를 가지게 된다. 모든 변수는 크게 봤을때 전역, 코드 블록(if, for while, try/catch), 함수 안에서 선언된다. 따라서 스코프의 종류도 전역 스코프, 블록 레벨 스코프, 함수 레벨 스코프로 나뉜다. 그림으로 살펴보면 아래와 같다. 전역 스코프 : 전역에 변수를 선언하면 이 변수는 어디서든 참조할 수 있다. 함수 레벨 스코프 : 함수 내에서 선언된 변수는 함수 내에서만 유효하며 함수 외부에서는 참조할 수 없다. 블록 레벨 스코프 : 코드 블록 내에서 선언된 변수는 코드 블록 ..
[ JavaScript ] this 자바스크립트의 this는 굉장히 골칫덩어리다. 이 글을 통해 this를 정복해보자. 정복당하는건 아닐지.. 자바스크립트의 함수는 호출될 때 매개변수로 전달되는 인자값 이외에 arguments 객체와 this를 암묵적으로 전달 받는다. 따라서 this는 함수 호출시 동적으로 결정된다. 그런데 호출 시점에 결정된다는게 어떤 의미인지 잘 와닿지 않기 때문에 함수를 종류별 나누고 각 케이스마다 어떻게 되는지 살펴보자. 그래서 우선 'this는 함수의 종류에 따라 바인딩 대상이 달라진다' 로 이해하자. 함수의 종류는 여러가지가 있는데 나는 여섯 가지로 분류해봤다. 아래가 이 글의 목차라고 생각하면 된다. 함수 종류 1. 일반 함수 2. 객체의 메소드 3. 화살표 함수 4. 생성자 함수 5. apply/call/b..
[ JavaScript ] String Methods & 정규표현식 String Methods includes - 문자 포함 여부 반환 // 구문 str.includes(searchString[, position]) // 예제 const str = "안녕하세요~ 안녕하세요! 좋은 하루 되세요~"; console.log(str.includes('안녕하세요')); // true console.log(str.includes('안녕', 9)); // false indexOf - 문자열에서 주어진 값과 일치하는 첫 번째 인덱스 반환 // 구문 str.indexOf(searchValue[, fromIndex]) // 예제 const str = "cat dog cat bird"; console.log(str.indexOf('cat')); // 0 console.log(str.inde..
[ JavaScript ] Array Methods 정리, sort 파헤치기 배열 메소드에 어떤 것이 있는지 한번 쭉 공부해봤다. 다 외우는건 뇌 낭비고(쓰다보면 외워진다) 그냥 어떤 메소드가 있는지 알아두기만 하는 용도로 글을 작성한다. sort는 내용이 조금 길어서 가장 마지막 순서에 적어놨다. 1. map map은 callback 함수를 각각의 요소에 대해 한번씩 순서대로 불러 그 함수의 반환값으로 새로운 배열을 만든다. 원본 배열이 바뀌지는 않는다. 구문은 아래와 같다. arr.map(callback(currentValue[, index[, array]])[, thisArg]) 여기서 [, something] 은 생략 가능하다는 의미다. currentValue만 적고 나머지는 안 쓰는게 일반적이다. thisArg를 제외하고 모든 파라미터를 사용한 예시는 아래와 같다. 아래..

반응형