'javascript' 태그의 글 목록 (2 Page)

javascript void 연산자

void 연산 void는 단항 undefined 연산자입니다. 피연산자로 무엇을 지정하든간에 연산의 결과는 undefined 값이 됩니다. 구체적인 예를 살펴보도록 하겠습니다. javascript // 피연산자가 숫자 console.log(void 0); // undefined 가 기록 // 피연산자가 문자열 console.log(void "문자열"); // undefined 가 기록 var x = 0; void x++; // 피연산자를 먼저 평가하기때문에 x 는 증가됩니다. console.log(x); // 1 이 기록 console.log(void(x)); // 피연산자를 괄호로 감싼 것은 잘 실행되어 undefined 가 출력 어디에 쓰는지 알기 어려운 연산자이지만 클라이언트 사이드 자바스크립트에서..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:30

예외 처리 - throw 및 try/catch/finally

throw & try/catch/finally(Exception Handling) 이 글에서는 예외 처리 방식에 대해 알아봅니다. 프로그램이 실행되는 동안 문제가 발생하면 프로그램이 자동으로 중단됩니다. 이럴 경우에 프로그램이 대처할 수 있도록 처리하는 것이 예외 처리(Exception Handling)라고 합니다. 프로그램 실행 중에 발생하는 오류를 예외(Exception)라고 하고, 프로그래밍 언어의 문법적인 오류를 에러(Error)라고 합니다. 예외가 발생하는 이유는 여러가지가 있겠지만 일반적으로 잘못된 코드를 작성했거나 사용자가 개발자가 원하지 않는 방향으로 프로그램을 사용했을 수도 있습니다. 예외는 기본 예외 처리와 고급 예외 처리 두 가지 방법으로 처리합니다. 예외가 발생하지 않게 사전에 해결..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:30

연관 배열로서의 객체 (=유사배열 객체)

자바스크립트 연관 배열 자바스크립트 객체의 프로퍼티명을 키, 프로퍼티 값을 값이라고 하며 객체 리터럴이 다중값 데이터 표현으로서의 객체라고 할 수 있습니다. 이 글에서는 자바스크립트에서 사용되는 연관 배열과 관련된 용어를 간단히 정리해 보도록 하겠습니다. 일반적으로 숫자를 키로 값을 뽑을 수 있는 데이터 구조를 배열이라고 합니다. 배열은 대부분의 프로그래밍 언어에 있는 기본적인 데이터 구조입니다. 배열의 키는 연속하는 숫자이므로 순서가 있는 값의 모음으로 볼 수 있습니다. 숫자 이외의 키는 대부분 문자열이지만 문자열에 한정되지 않고 임의의 타입인 키를 이용하여 키와 값의 모음을 다루는 데이터 구조를 연관 배열이라고 합니다. 그리고 연관 배열을 맵이나 사전이리고 부르는 언어도 있으며 내부 구현에서는 해시(..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:29

자바스크립트 constructor & instanceof

constructor property 생성자 인스턴스에는 자신의 생성자함수를 가리키는 속성이 있습니다. 객체를 인스턴스로 만들면 이 객체/인스턴스에는 constructor 라는 속성(프로퍼티)이 자동으로 추가되는데, 이 속성은 해당 객체를 만든 생성자 함수를 가리키게 됩니다. 다음은 사용자 정의의 객체에서 constructor 속성을 사용할 수 있는지를 알아보겠습니다. var obj = {}; // 객체 리터럴로 객체를 생성한 후 obj 변수에 객체를 저장. console.log(obj.constructor === Object); /** * Object() 가 obj 를 만들었으므로 true 가 출력된다. */ console.log(obj.constructor); // Object()인 생성자 함수를 가..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:29

자바스크립트의 배열(Array) 기초

배열(Array) 배열은 자바스크립트 객체의 특별한 형태입니다. 즉, C나 자바의 배열과 같은 기능을 하는 객체이지만, 이들과는 다르게 굳이 크기를 지정하지 않아도 되며, 어떤 위치에 어떤 타입의 데이터를 저장하더라도 에러가 발생하지 않습니다. 자바스크립트 배열은 어떤 타입이던지간에 그 타입의 데이터를 연속된 공간에 저장하는 자료구조입니다. 그리고 각 데이터 저장 위치는 인덱스를 부여해서 접근할 수 있습니다. 배열 리터럴 배열을 사용하기 위해서는 Array() 를 이용하는 방법도 있지만 포스팅에서는 자주 이용되는 배열리터럴에 대해 알아보겠습니다. 배열 리터럴은 자바스크립트에서 새로운 배열을 만드는 데 사용하는 표기법입니다. 객체 리터럴이 중괄호( {} )를 이용한 표기법이었다면, 배열 리터럴은 대괄호( ..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:28

프로토타입방식의 클래스

프로토타입기반 클래스 기초 특징 1) 코드 재사용 기능 함수 기반 클래스(생성자 패턴)와 동일하게 여러 개의 인스턴스를 만들어 재사용할 수 있는 장점이 있습니다. 2) 메서드 공유 기능 단점이 없어 보이는 함수 방식 클래스는 치명적인 단점을 가지고 있습니다. 바로 인스턴스마다 내부의 모든 메서드가 독립적으로 만들어 진다는 것입니다. 하지만 프로토타입을 이용하면 모든 인스턴스마다 프로토타입객체를 상속받기 때문에 인스턴스마다 독립적으로 메서드가 생성되는 것이 아니라 해당 메서드를 상속받아 사용하기 때문에 오직 해당 메서드는 하나뿐입니다. 다시 말해서 prototype 을 이용해 상속을 구현한다는 점입니다. 예를 들어 '문자열'.toString() 과 같습니다. 프로토타입 클래스 문법 타입 function 클..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:21

실행 컨텍스트의 개념

CONTEXT 실행 컨텍스트의 개념을 설명하기에 앞서 call stack(콜 스택)을 먼저 알아보자. 이는 함수를 호출할때 해당함수의 호출정보가 차곡차곡 쌓여있는 스택(잘 정리된 더미)을 의미한다. 프로그램을 작성할때 main함수(외부)가 있고 main 함수 내에서 다른 함수를 호출한다고 했을 때 이렇게 호출된 함수가 또 다시 다른 함수를 호출 할 수도 있고 단순 처리과정만을 거친 후 main 함수로 돌아 갈 수도 있다. 즉, A함수 내부에 B함수를 호출하고 B함수 처리과정 중에 C라는 함수를 또 호출된다고 할때 이러한 처리 순서를구현하기 위해서 사용되는 것이 call stack이라는 구조이다. (이 구조는 크롬의 개발자 도구의 우측에서 확인할 수가 있다.) 이러한 콜 스택의 호출 정보등으로 코드의 실행..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:19

자바스크립트 생성자 패턴 - new를 강제하는 패턴

javaScript 생성자 함수의 핵심 패턴 자바스크립트에는 클래스가 없기 때문에 상당히 유연합니다. 객체에 대해 사전에 알아두어야 하는 내용, 즉 클래스의 '청사진' 같은 것이 필요없기 때문입니다. 그러나 자바스크립트에도 자바와 같은 클래스 기반 객체 생성과 비슷한 문법을 가지는 생성자 함수가 존재합니다. 생성자 함수로 객체 생성하기 객체를 생성할 때는 사용자가 직접 만든 생성자 함수를 사용할 수도 있고, Object(), Date(), String() 등 내장 생성자를 사용할 수도 있습니다. 다음 예제는 동일한 객체를 생성하는 두 가지 방법을 보여줍니다. javascript // 첫 번째 방법 - 객체 리터럴 사용 var car = { goes : 'far'}; // 다른 방법 - 내장 생성자 사용 ..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:18

자바스크립트 생성자

JS Constructor 자바스크립트 생성자는 객체 인스턴스를 생성하고 반환한다. 생성자 함수의 역할은 같은 값과 동작을 공유하는 객체를 여러 개를 만드는 것에 있습니다. 기본적으로 생성자 함수는 기본 속성과 속성 메소드를 갖춘 객체를 생산해내는 쿠키틀(cookie cutter)과 같은 것입니다. 만약에 다른 누군가가 "생성자 함수는 그냥 함수이잖아!!" 라고 한다면 "맞아.. new 키워드를 사용해서 실행하지 않는다면 그냥 함수일 뿐이지.." 라고 답할 수 있습니다. E.g.) new String('foo'); new 키워드를 사용하면 자바스크립트가 생성자 함수 내에 있는 this 의 값을 새로 만들어진 객체로 설정함으로써 생성자 함수는 일반함수와는 다른 특수한 동작을 수행하게 되는 것입니다. 특수한..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:18

자바스크립트 함수 - Function

JS Function(자바스크립트 함수) 자바스크립트는 함수를 다양한 방법으로 사용합니다. 따라서 함수를 완벽히 익히는 것은 자바스크립트 개발자에게 필수 기술일 것입니다. 다른 언어에서는 별도의 문법으로 처리하는 다양한 작업들을 자바스크립트에서는 함수가 수행합니다. 이 글에서는 자바스크립트에서 함수를 정의하는 다양한 방법들과 함수 표현식 그리고 함수 선언문에 대해서 알아보고 지역 유효범위와 변수 호이스팅(hoisting)이 어떻게 동작하는지 살펴보도록 합니다. 그리고 나서 함수에 더 나은 인터페이스를 제공하는 API, 전역 변수를 덜 사용하는 초기화, 불필요한 작업을 회피해 성능에 도움을 주는 여러가지 패턴들에 대해 알아봅니다. 배경 지식 자바스크립트의 함수를 특별하게 만드는 두 가지 중요한 특징이 있습..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:16

참조타입의 특성

참조 타입 자바스크립트에서 기본타입 5가지를 제외한 모든 값은 객체입니다. 배열이나 함수또한 객체로 취급됩니다. 이러한 객체는 자바스크립트에서 참조 타입이라고 부릅니다. 이것은 객체의 모든 연산이 실제 값이 아닌 참조값으로 처리되기 때문입니다. 기본타입은 직접 값을 가지고 있는 반면에 참조타입은 직접 값을 가지고 있지 않고 참조하는 객체에 번지를 가지고 있습니다. ■ 스택(Stack) 영역 - 함수 호출, 변수 생성시 생성되는 지역 변수와 매개 변수가 저장되는 영역 - 함수 호출이 완료되면 사라진다. 다시말해서, 스택영역에는 기본적으로 변수들이 생성이 되는 영역입니다. ■ 힙(Heap) 영역- 필요에 의해 동적으로 메모리를 할당할 때 사용 - 객체/배열에 저장되는 영역 - 사용되지 않는 객체는 GC(가비..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:15

참조란 무엇인가?

참조란? 복제 var a = 1; // 원시 데이터타입이 담겨있을 경우(String,Number,Boolean,null,undefined) var b = a; b = 2; console.log(a); // 1 결과는 당연하다. 값을 변경한 것은 변수 b이기 때문에 변수 a에 담겨있는 값은 그대로입니다. 변수 b의 값에 변수 a의 값이 복제된 것입니다. 다시 말해서, 1을 카피하여 또 다른 별도의 데이터 1을 b 가 가지고 있는 것입니다. 참조와 변수 var a = {'id':1}; // 원시 데이터 타입이 아닌 것들은 다르게 동작한다. var b = a; b.id = 2; console.log(a.id); // 2 놀라운 차이점이 있습니다. 변수 b에 담긴 객체의 id 값을 2로 변경했을 뿐인데 a.id..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:14

Object와 Object()와의 차이점

Object Vs Object() Object와 Objcet()의 차이점을 알아보기에 앞서 다음 내용을 먼저 숙지해 봅니다. Object()는 new Object()와 같이 인스턴스를 생성하여 반환한다. 그래서 new Object()와 파라미터를 지정하는 방법, 형태, 인스턴스 반환이 모두 같다. 다만 new 연산자를 사용하지 않을 뿐이다. 그렇다면 Object와 Object()의 차이점은 무엇일까? 아래 코드를 살펴보자. // 빌트인 Object 객체를 obj1에 할당 var obj1 = Object; console.dir(obj1); // Object()로 새로운 Object를 생성하여 obj2에 할당 var obj2 = Object(); console.dir(obj2); 둘의 차이점은 ()호출 유무..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:08

객체란 무엇인가?

Object 자바스크립트의 거의 모든 것은 객체이다. 이는 기본 데이터타입인 boolean, number, string 그리고 특별한 값인 undefined, null을 제외한 나머지는 모두 객체이기 때문이다. 하지만 boolean, number, string 인 기본 데이터타입은 모두 객체처럼 다룰 수도 있다. 그렇기 때문에 자바스크립트는 null과 undefined를 제외한 모든 것을 객체로 다룰 수 있다. 객체(Object)란 단지 이름이 지정된 프로퍼티(property)의 모음이며, 키(key) : 값(value)의 쌍으로 이루어진 목록이다. 자바스크립트에서 기본 데이터타입은 하나의 값만을 가지는 데 비해, 참조 타입인 객체는 여러 개의 프로퍼티를 포함할 수 있다. 여기서 참조 타입이라 함은 객체..

JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:06

객체 지향 프로그래밍(OOP)

OOP(Object Oriented Programing) 자바스크립트를 좀더 편리하게 사용하기 위한 라이브러리를 만들때는 하나의 이름으로 여러가지 기능들을 구조화하여 사용해야 하는데 이런 기능을 구현하기 위한 것이 OOP기능이다. 예를 들어 자바스크립트 라이브러리인 jQuery도 jQuery라는 하나의 이름으로 여러가지 기능들을 구조화하여 만들어진 것이다. 자바스크립트 객체는 사전/콜렉션 형태이다. 하나의 이름으로 여러개의 값을 담고 있는 형태이다. C++ / C# / Java => 객체는 클래스나 구조체의 인스턴스 자바스크립트객체는 단순히 이름/값 쌍의 콜렉션 "."(점) 연산자 또는 일반적으로 사전을 처리할 때 사용되는 "[]"(대괄호) 연산자를 사용하여 객체의 속성을 얻거나 설정할 수 있음. 사전은..