반딧불이 코딩

프로토타입을 통해서 자바스크립트는 상속이라고 하는 개념을 제공하고있다. function Ultra(){} Ultra.prototype.ultraProp = true; function Super(){} Super.prototype = new Ultra(); function Sub(){} Sub.prototype = new Super(); var o = new Sub(); console.log(o.ultraProp); > true sub를 통해 만들어진 객체 자체에는 ultraProp 라는 값을 가지고 있지 않다. 이 값은 sub의 부모 객체인 super의 부모 객체인 ultra가 ultraProp이라는 값을 가지고 있다. 서브는 슈퍼를 상속받고, 슈퍼는 울트라를 상속받고 있는 것이다. 그리고 울트라안에 u..

객체(오리지널, 부모객체)를 그대로 물려받아서 새로운 객체를 만들 수 있다. 상속받은 객체가 부모객체의 어떠한 기능은 제거하거나 추가해서 자신의 맥락에 맞게 부모의 객체의 로직을 재활용하면서 추가하거나 제거하는 것이 상속의 기본적인 동작방법이다. 부모의 재산을 상속받듯이 오리지널 객체가 가진 기능을 상속받는 객체가 동일하게 가질수 있다. function Person(name){ this.name = name; this.introduce = function(){ return 'My name is '+this.name; } } var p1 = new Person('apple'); document.write(p1.introduce()+" "); > My name is apple function Person(n..

this는 함수를 어떻게 호출하냐에따라 가리키는 대상이 달라진다. function func(){ if(window === this){ document.write("window === this"); } } func(); > window === this var o = { func : function(){ if(o === this){ document.write("o === this"); } } } o.func(); > o === this 객체의 소속인 메소드의 this는 메소드를 호출한 객체를 가리킨다. 첫번째 경우는 전역 객체인 window를 넣어주면 함수를 호출할때 window.func();로 두 경우 모두 메소드가 속한 객체를 가리키고 있다. var funcThis = null; function Func..

var person1 = { 'name' : 'apple', 'introduce' : function(){ return 'My name is '+this.name; } } var person2 = { 'name' : 'banana', 'introduce' : function(){ return 'My name is '+this.name; } } 이런식으로 여러 사람의 이름을 담는 객체를 여러개 만든다고 한다면 introduce메소드들은 내용이 완전히 동일하고 객체의 취지가 같다고할때 메소드의 동작방법을 바꾼다고 하면 객체들이 가지고 있는 메소드들을 전부 찾아서 똑같이 바꿔줘야 하는 일이 생긴다. 이러한 것을 중복이라고 한다. 중복이 있다는것은 코드 가독성이 떨어진다는 것. 코드의 양이 많아진다는 것. 유지..

자바스크립트에서 함수라고 하는것은 일종의 객체이다. 객체는 속성을 가지고 있고 그 속성에 '값'이 저장되어 있다면 그냥 속성(property)라고 하고, 그 속성(property)에 함수가 저장되어 있다면 메소드(method)라고 한다. 함수의 가장 기본적인 호출 방법이다. func라는 변수에 담겨있는 자바스크립트 호출하게 된다. function func(){ } func(); func라는 이름의 함수는 객체이기 때문에, 저 함수는 메소드를 가지고 있다. 저 메소드는 기본적으로 가지고 있는 내장된 메소드, 내장된 객체이다. func라는 이름의 함수를 정의하게 되면 func.apply혹은 func.call 이라고 하는 메소드에 접근을 할 수가 있다. 메소드들이 하는 역할은 정의한 함수를 호출하는 역할을 한..

arguments 함수 안에서 함수의 여러가지 정보를 담고있는 (특히나 인자에 관련된) 객체, 사용방법이 배열과 유사하다. 유사배열이라고도 한다. 매개변수(parameter)와 인자(arguments)의 차이 function a(arg){ // arg를 매개변수 실행시킬 코드 } a(1);// 1을 인자라고 한다. 매개변수는 변수이고 그 변수에 들어가는 값을 인자라고 하는데 엄격하게 구분하지 않는 경우가 많이 있다. function sum(){ var _sum = 0; for(var i = 0; i < arguments.length; i++){ document.write(i+' : '+arguments[i]+' '); _sum += arguments[i]; } return _sum; } document...

접근하려고 하는 외부함수의 생명주기가 종료됬지만, 내부함수가 참조 하고 있어서 외부함수에 접근할 수 있는갓 내부함수 자바스크립트는 함수 안에서 또 다른 함수를 선언할 수 있습니다. function outter(){ function inner(){ var title = 'Hello world'; alert(title); } inner(); } outter(); 함수 outter의 내부에는 함수 inner가 정의되어 있다. 함수 inner를 내부함수라고 한다. 내부함수는 외부함수의 지역변수에 접근할 수 있다. function outter(){ var title = 'Hello world'; function inner(){ alert(title); } inner(); } outter(); // Hello wo..

유효범위(Scope) 변수가 어디까지 영향을 미치는가에 대한 범위를 유효범위라고 한다. 유효범위는 크게 지역변수(local variable)와 전역변수(global variable)로 나뉜다. 자바스크립트의 지역변수는 함수에서만 유효하다. 전역변수 자바스크립트에선 함수 밖에서 정의된 변수 // 전역함수 예1 var scope = 'global'; function gscope(){ console.log(scope); } gscope(); // 전역함수 예2 for(var i = 0; i < 5; i++){ // for문에 들어가는 변수 i도 함수밖이기 때문에 전역함수이다. a(); document.write(i); } 지역변수 자바스크립트에선 함수 안에서 정의된 변수 함수 블록{} 안에서만 유효하다. //..

객체는 배열이랑 유사한 역할을 수행하고 있다. 연관되는 데이터들을 담아내는 그릇정도로 이해하면 된다. (여러 데이터와 함수로 이루어져 있다. 객체 안에 있을때는 프로퍼티와 메소드라고 부른다.) 객체의 접근 연산자는 ' . ' 이다. 배열과 객체의 가장 큰 차이점은 객체는 index 값을 숫자나 문자열등 사용자가 원하는 데이터로 지정해줄 수 있다. 객체는 {}안에 데이터를 담는다. 배열의 index(자동으로 0부터 할당하여 추가) = 객체의 key 배열의 element = 객체의 vlaue 객체의 생성 // 1번째 방법 var grades = {}; // 비어있는 객체를 생성 grades.key = 'value'; // grades['key'] = 'vlaue'; 라고 쓸수도 있다. console.log(..

array 연관되어 있는 데이터를 모아서 통으로 관리하기 위해서 사용하는 데이터 타입 하나의 변수안에 여러개의 데이터를 담을 수 있다 var member = ['egoing', 'k8805', 'sorialgi']; // 3가지 element를 하나의 그릇에 담은것이고 그 그릇을 member라는 변수에 다시 담은것 배열은 반드시 대괄호로 시작해서 대괄호로 끝나야한다. 배열에 들어있는 각각의 데이터를 element(원소)라고 한다. var member = ['egoing', 'k8805', 'sorialgi'] alert(member[0]); alert(member[1]); alert(member[2]); 배열안에 데이터를 꺼내고 싶을때는 element의 index 번호를 대괄호안에 적으면 된다. inde..