Javascript

Scope란? 변수가 접근가능한 범위이다. 내부와 외부를 판별하는 기준은 함수이다. var 키워드는 함수 단위함수가 하나의 범위. let 키워드는 '{}' 중괄호가 하나의 범위. 내부에서 외부는 접근 가능하지만, 외부에서 내부는 접근 불가능 하다. scope.gif 함수가 범위의 기준이 된다. 내부에서 외부는 접근 가능하지만, 외부에서 내부는 접근...

Document Object Model HTML 은 구성을 짜는 설계도 같은 역할을 하고, CSS 로 디자인을 했다면, DOM을 이용해서 화면을 만들어 준다. document html 문서의 구조와 관계를 객체로 표현한 모델. html 문서도 javascript 객체도 부모와 자식이 있는 트리구조 이다. document라는 전역 변수로 접근이 가능하다...

Recursion 자기 자신을 호출하는 함수 재귀 함수를 사용할 때 탈출 조건을 꼭 만들어 주어야 한다.그렇지 않으면 무한 루프를 돌다가 결국 콜스텍 오버 에러를 낸다. 트리구조를 표현, 탐색하기에 재귀함수가 유용하다 장점: 알고리즘이 재귀로 표현했을 때 가독성이 좋다 . 단점: 값이 리턴되기 전까지 호출마다 call stack을 새로 생성하므로, 메...

let과 var의 차이점 let: block scope 안에서 유효한 스코프를 가지고 있으며, 지역변수를 선언한다. var: function scope 안에서 유효한 스코프를 가지고 있으며, 전역변수를 선언할 수 있다. let은 전역 객체를 통해 접근할 수 없지만 var는 접근이 가능하다. let은 재선언 할 수 없지만, var는 재선언 할 수 있다....

화살표 함수에는 없는 것: 함수 이름, this, arguments 생성자로서 사용할 수 없다. 화살표 함수는 항상 익명이다. this가 없다. arguments가 없다. 화살표 함수에서는 arguments가 없다. 위와 같이 outter 함수를 감싸주면 화살표 함수는 outter의 scope를 참조한다. 파라미터 부분에 ...args를 사용하면...

_.identity _.identity는 인자를 그대로 반환 한다. _.first _.first는 배열의 처음 n개의 element를 담은 배열을 반환한다. 만일 n이 undefined일 경우, 단순히 첫번째 element를 반환한다. _.last _.last는 마지막 n개의 element를 담은 배열을 반환한다. 만일 n이 undefined일 경...

자바스크립트에서 비동기가 왜 중요할까? > ## 자바스크립트는 single-threaded 이기 때문이다. > > ### single threaded / single callstack란? 쓰레드가 하나라는 말이다. 쓰레드 하나에 하나의 callstack이 존재한다. 하나의 callstack은 한 번에 하나의 작업만을 실행한다. >>> 실행해야 하는 작...

Object Oriented Programming / 객체 지향 프로그래밍 ? > 객체지향은 동작하는 부분을 캡슐화해서 이해할 수 있게 하고, 함수형 프로그래밍은 동작하는 부분을 최소화해서 코드 이해를 돕는다. -마이클 페더스‘레거시 코드 활용 전략' 저자 >> 객체지향의 경우 객체 안에 상태를 저장한다. 각 객체는 메시지를 받을 수도 있고, 데이터를...

Big-O 란? > big-O는 알고리즘의 효율성을 나타내는 지표이다. big-O를 이용하여 알고리즘의 성능을 판단한다. big-O표기법은 보통 알고리즘의 시간 복잡도와 공간 복잡도를 나타내는데 주로 사용된다. >> 시간 복잡도는 알고리즘의 시간 효율성을 의미한다. 시간 복잡도란 시간 개념으로 알고리즘의 수행 시간패턴이 얼마인지를 나타낸다. 시간이 늘어...

Linked List / 연결리스트 linkedlist.gif > 여러 노드들이 위 그림과 같이 한 방향을 가리키는 연결 구조이다. 가장 처음 시작하는 노드를 head라고 하며, 가장 마지막 노드를 tail이라고 한다. 노드 들은 본인의 이전 노드와 다음 노드를 기억한다. >> 예를 들어, 어떠한 작업을 했을 때, 이전 단계로 작업을 되돌리기 위해 단축키...

Tree > 나무를 뒤집어 놓은 것처럼 하나의 시작 노드(root)로부터 시작되어 자식 노들(child node)들이 가지를 치듯 뻗어 나가는 구조이다. 아래 그림과 같이 HTML이 좋은 예이다. root(뿌리)부터 시작해서 아래로 자식 노드들이 뻗어나가는 구조이다. 가장 위는 root이고 제일 아래를 leaf라고 한다. leaf는 자식이 없는 노드이다....

hash table > 어떠한 데이터를 받아 저장하려고 할 때, 저장할 데이터의 키를 받아 해시 코드로 변환해서 데이터 구조에 저장한다. 해시 코드를 만드는 것을 hashing이라고 하는데 hashing 이란 암호화하는 것이다. 해시 함수는 암호를 일정한 길이로 반환해준다. 대표적으로 ex) MD5, SHA .. 등 이 있다. 해시 함수는 연산을 여러 번...

디자인 패턴이란? 프로그램을 개발하는 과정에서 발생하는 다양한 문제점들을 해결하기 위해 많은 개발자들이 빈번하게 발생하는 문제들을 상황에 따라 적용해서 쓸 수 있는 패턴 형태로 만든 증명된 기술들이다. 어떠한 상황에서 정확한 해결책을 제시해 주는 것은 아니지만 일종의 방향성(솔루션)을 제시해준다. 1. Modules 모듈 패턴 모듈(module)은 일...

Asynchronus > 자바스크립트는 비동기 처리를 위해 콜백 함수를 사용한다. 콜백 함수는 순차적인 처리가 많을 경우 가독성이 나쁘다. 또, 비동기 처리를 한꺼번에 처리하는 것도 한계가 있으며 에러 예외 처리에 대한 곤란한 부분이 있다. >> ## Promise? promise는 자바스크립트 비동기 처리에 사용되는 비동기 흐름을 제어해 주는 객체이다....

배열은 순차적으로 비동기 처리를 하려고 할 때, promise 사용법을 블로깅 하려고 한다. 반복문이 있을 경우 promise를 사용하기 어려웠다. 예를 들어, i를 순차적으로 콘솔에 찍은후 then을 실행하여 ''Done''를 찍으려고 작성했던 코드이다. 하지만 아래와 같이 실행된다. image.png 위와 같이 실행되는 이유는 처음 i를 찍은 후 ...

String, Boolean, Number같은 원시형 값을 복사했을 경우 순수한 값이 복사되고 독립적인 값이 저장된다. 하지만 Reference형 객체 복사에는 크게 얕은 복제(shallow copy)와 깊은복제(deep copy)로 분류 된다. shallow copy

자바스크립트에서 데이터 타입에는 아래와 같이 원시형과 참조형으로 나뉩니다.자바스크립트 메모리 구조는 스택 메모리(정적 할당, 변수, 원시형 데이터 저장)와 힙 메모리(동적 할당, 참조형 데이터, 저장) 영역으로 나뉘어 있습니다.객체를 제외한 모든 타입은 원시 값(불변

자바스크립트가 실행되는 환경으로 함수를 실행할 때 필요한 조건, 환경정보를 제공하는 객체입니다.실행 컨텍스트를 이해하면 Scope, hoisting, closure, this와 같은 중요한 동작을 이해할 수 있습니다.아래는 위 코드를 실행 컨텍스트 내부로 추상화한 것입

자바스크립트에서 this는 실행 컨텍스트가 생성될 때 바인딩됩니다.즉, 함수가 호출될 때 this가 결정된다는 것입니다.아래 소스를 보면 어떻게 호출했느냐에 따라 this가 달라집니다.결과가 다른 이유는 myName()은 함수로 호출을 했고 student.myName(

서로 관련 있는 데이터와 함수를 객체(하나의 역할을 수행하는 메소드와 변수의 묶음)로 정의해서 서로 상호작용할 수 있도록 프로그래밍해나가는 것을 의미합니다.각 객체는 메시지를 받을 수 있고, 데이터를 처리할 수도 있으며, 또 다른 객체에게 메시지를 전달할 수도 있습니다

자바스크팁트는 프로토타입 기반의 객체지향 언어입니다.프로터타입에 할당되지 않고 생성자 함수 객체에 직접 할당되어있는 프로퍼티와 메소드를static method, static properties라고 합니다.생성자 함수를 new 연산자 없이 함수로써 호출할 때 사용됩니다.