JS 문법 검색 결과

해당 글 53건

참조타입의 특성

참조 타입 자바스크립트에서 기본타입 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 => 객체는 클래스나 구조체의 인스턴스 자바스크립트객체는 단순히 이름/값 쌍의 콜렉션 "."(점) 연산자 또는 일반적으로 사전을 처리할 때 사용되는 "[]"(대괄호) 연산자를 사용하여 객체의 속성을 얻거나 설정할 수 있음. 사전은..
JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:06

데이터 타입변환(형 변환)

형 변환이란? 코드를 작성하다 보면 종종 문자를 숫자로 변환한다거나 숫자를 문자로 변환해야 하는 경우가 발생합니다. 이런 경우를 형변환(데이터 타입변환)이라고 합니다. 형 번환 종류 형변환에는 다음과 같이 두가지가 있습니다. 1. 암시적 형변환 - 자바스크립트 엔진이 필요해 의해 암시적으로 형(데이터타입)을 자동으로 변환시키는 것을 암시적 형변환이라고 합니다. 2. 명시적 형변환 - 개발자가 자바스크립트를 이용해서 직접 어떤 형으로 변환할 지를 명시해주는 것을 명시적 형변환이라고 합니다. 형변환 변경 주체 변경 방식 암시적 형변환 자바스크립트 엔진 자동(암시적) 명시적 형변환 개발자 수동(명시적) 암시적 형변환 암시적 형변환이란 앞선 내용에서와 같이 자바스크립트 엔진에 의해 자동으로 데이터 타입이 변환되..
JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:04

javascript for in 문

for in 문 for in 문은 객체의 프로퍼티명을 열거하는 반복문입니다. for in 문은 다음과 같은 구문을 사용합니다. // for in 문의 문법 for (변수 in 객체식) { // 문장 } in 의 왼쪽에는 대입할 곳으로 사용할 수 있는 식을 사용합니다. 문법상으로는 좌변값을 씁니다. 좌변값이란 대입식의 좌변에 쓸 수 있는 값을 말하는데, 변수명을 쓴다고 생각하면 충분합니다. for 문과 같이 for in 문 안에서 변수 선언도 할 수 있습니다.(스코프가 for in 문으로 끝나지 않은 점도 같습니다. 다음부터는 이 변수를 루프변수라고 명명하겠습니다. in의 우측에는 객체 타입인 식을 사용합니다. 이미 아실 수 있겠지만 자바스크립트에는 암묵적 형변환이 있고, 어떤 값이라도 객체 타입으로 형변..
JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:03

반복문(for문, while문, do-while문)

반복문(for문, while문, do-while문) 및 break문, continue문 반복문은 어떤 작업(코드들)이 반복적으로 실행되도록 할 때 사용되며, 반복문의 종류로는 for문, while문, do-while문이 있습니다. for문, while문은 서로 변환이 가능하기 때문에 반복문을 작성할 때 어느 쪽을 선택해도 좋지만, for문은 반복 횟수를 알고 있을 때 주로 사용하고 while문은 조건에 따라 반복할 때 주로 사용합니다. while문과 do-while문의 차이점은 조건을 먼저 검사하느냐 나중에 검사하느냐일 뿐 동작 방식은 동일합니다. for문 반복횟수를 알고 있을 때 주로 사용한다. for문의 작성형식과 실행흐름은 아래 그림을 참조 var sum = 0; for(var i = 0; i
JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 09:02

유효범위의 효용

스코프 유효범위의 효용 아래 두개의 예제는 변수 i를 지역변수로 사용했을 때와 전역변수로 사용했을 때의 차이점을 보여준다. 전역변수는각기 다른 로직에서 사용하는 같은 이름의 변수값을 변경시켜서 의도하지 않은 문제를 발생시킨다. function scope() { var i = 0; // 지역변수 } for(var i = 0; i < 5; i++) { scope(); console.log(i); } // 의도한 결과대로 0,1,2,3,4를 출력 function scope2() { j = 0; // 전역변수 } for(var j = 0; j < 5; j++) { scope2(); console.log(j); } // 의도치 않은 무한 루프에 빠지게 된다. 같은 이름의 변수를 사용했지만 각각의 취지가 다를때 위..
JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 08:59

지역변수와 전역변수

지역변수 VS 전역변수 유효범위(scope)는 변수의 수명을 의미합니다. 다음의 코드를 살펴보겠습니다. JavaScript var scope = 'global'; function fnScope() { console.log(scope); } fnScope(); 위 코드의 취지는 함수 안에 선언되어 있지 않고 함수 밖에 선언되어 있는 scope 라는 변수에 접근할 수 있다라는 것이 포인트입니다. 함수 밖에서 변수를 선언하면 그 변수는 전역변수가 되고 전역변수는 애플리케이션 전역에서 접근이 가능한 변수입니다. 다시 말해서, 어떤 함수 안에서도 그 변수에 접근 할 수가 있다. 그렇기 때문에 fnScope 내에서 scope를 호츨했을 때 함수 밖에서 선언된 scope의 값인 global이 반환된 것입니다. Jav..
JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 08:59

undefined와 null의 차이점

undefined vs null 이 두 타입은 모두 자바스크립트에서 '값이 없음'을 나타냅니다. 기본적으로 값이 할당되지 않은 변수는 undefined 타입이며, undefined 타입은 변수 자체의 값 또한 undefined 입니다. 즉, 정의되지 않은 것, 초기화되어 있지 않거나 존재하지 않는 객체의 프로퍼티 및 존재하지 않는 배열의 원소값에 접근하려고 할때 얻어지는 변수의 값입니다 결론적으로 undefined는 데이터 타입이자, 값을 나타냅니다. var jaehee; 와 같이 변수를 선언하면 jaehee 변수에 undefined를 할당하게 됩니다. 여기서 중요한 것이 변수의 초깃값이 undefined라는 점이다. 비록 변수만 선언했지만 값을 가진다는 말입니다. 그렇기 때문에 값이면서 데이터 타입인 ..
JavaScript/Core & 개념ㆍ용어 2016. 9. 29. 08:58

자바스크립트 모듈 - module

모듈이란?순수한 자바스크립트에서는 모듈(module)이라는 개념이 분명하게 존재하지는 않습니다. 하지만 자바스크립트가 구동되는 호스트 환경에 따라서 서로 다른 모듈화 방법이 제공되고 있습니다. 이 글에서는 자바스크립트의 대표적인 호스트 환경인 웹브라우저에서 로직을 모듈화하는 방법에 대해서 알아봅니다. 모듈 개념프로그램은 작고 단순한 것에서 크고 복잡한 것으로 진화합니다. 그 과정에서 코드의 재활용성을 높이고, 유지보수를 쉽게 할 수 있는 다양한 기법들이 사용되고 있습니다. 그 중의 하나가 코드를 여러개의 파일로 분리하는 것입니다. 이를 통해서 얻을 수 있는 장점은 다음과 같습니다.자주 사용되는 코드를 별도의 파일로 만들어서 필요할 때마다 재활용할 수 있다. 코드를 개선하면 이를 사용하고 있는 모든 애플리..
JavaScript/Core & 개념ㆍ용어 2016. 3. 9. 16:12

HTMLElement, HTMLCollection 객체와 DOM 트리

HTMLElement 객체와 DOM Tree이 포스팅에서는 HTMLElement 객체와 DOM(Document Object Model)에 대해 알아봅니다. 문서 개체 모델(Document Object Model, DOM) 은 자바스크립트 Node 개체의 계층화된 트리입니다.HTML 문서를 작성할 때에는 HTML 콘텐츠를 다른 HTML 콘텐츠 내에 캡슐화하게 되는데, 이를 통해 트리(tree)로 표현 가능한 계층 구조가 만들어집니다.대개 이러한 계층 구조나 캡슐화 시스템은 HTML 문서 내에서 들여쓰기 표시를 통해 시각적으로 표시됩니다.브라우저는 HTML 문서를 로딩 시 이 계층 구조를 해석해서 마크업이 어떻게 캡슐화되었는지를 보여주는 노드 개체 트리를 생성합니다.브라우저는 HTML 코드를 해석해서 트리 ..
JavaScript/DOM(Document Object Model) 2016. 3. 7. 12:00

event 란 무엇인가?

이벤트(event)란?이벤트(event)는 어떤 사건을 의미합니다. 브라우저에서의 사건(event)이란 사용자가 클릭을 했을 '때', 스크롤을 했을 '때', 필드의 내용을 바꾸었을 '때'와 같은 것을 의미합니다. 이벤트에 대하여다음의 예제는 이벤트 타입 중의 하나입니다. html onclick 속성의 자바스크립트 코드(alert(window.location))는 사용자가 이 버튼을 클릭 했을 '때' 실행됩니다. 즉 js 개발자는 어떤 일이 발생했을 때 실행 되어야 하는 코드를 등록하고, 브라우저는 그 일이 발생했을 때 등록된 코드를 실행하게 되는 구조입니다. 이러한 방식을 이벤트 프로그래밍이라고 합니다. event targettarget은 이벤트가 일어날 객체를 의미합니다. 아래 코드에서 타겟은 버튼 태..
JavaScript/DOM(Document Object Model) 2016. 3. 4. 07:00