javascript
-
JavaScript PrototypeMOOC/생활코딩 2016. 4. 24. 11:29
2016.04.24. - 자바스크립트 프로토타입 1234567891011function 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);cs 그럼 prototype이란 무엇인가? 한국어로는 원형정도로 번역되는 prototype은 말 그대로 객체의 원형이라고 할 수 있다. 함수는 객체다. 그러므로 생성자로 사용될 함수도 객체다. 객체는 프로퍼티를 가질 수 있는데 prototype이라는 프로퍼티는 그 용도가 약속되어 있는 특수한 프로퍼티다..
-
JavaScript 상속MOOC/생활코딩 2016. 4. 24. 01:21
2016.04.23. - 상속 상속이란 객체로 연관된 로직들로 이루어진 작은 프로그램이라고 할수 있는데 상속은 객체의 로직을 그대로 물려받는 또 다른 객체를 만들 수 있는 기능을 의미한다. 또한 이 상속된 객체들의 로직을 수정하고 변경해서 파생된 새로운 객체를 만들수 있게 한다. 123456789101112131415function Person(name){ this.name = name;}Person.prototype.name=null;Person.prototype.introduce = function(){ return 'My name is '+this.name; } function Programmer(name){ this.name = name;}Programmer.prototype = new Perso..
-
JavaScript thisMOOC/생활코딩 2016. 4. 23. 21:37
2016.04.23. - this this는 함수 내에서 함수 호출 맥락 (context)를 의미한다. 이는 상황에 따라서 의미가 달라질수 있다는 뜻인데 함수를 어떻게 호출하느냐에 따라 this가 가리키는 대상이 달라진다는 뜻이다.함수와 객체의 관계가 느슨한 자바스크립트에서 this는 이 둘을 연결시켜주는 실질적인 연결점의 역할을 한다. 12345678var o = { func : function(){ if(o === this){ document.write("o === this"); } }}o.func(); cs 객체의 소속인 메소드의 this는 그 객체를 가르킨다. 고로 결과값은 o===this가 출력된다. - 생성자의 호출 1234567891011121314var funcThis = null; fun..
-
JavaScript 전역객체MOOC/생활코딩 2016. 4. 23. 20:37
2016.04.23. - 전역객체 전역객체는 특수한 객체로 모든 객체는 이 전역 객체의 프로퍼티이다. 12345function func(){ alert('Hello?'); }func();window.func();cs func(); 와 window.func(); 모두 실행이 되는데 모든 전역변수와 함수는 window 객체의 프로퍼티이므로 작동하는것이다. 하지만 명시하지 않아도 암시적으로는 window의 프로퍼티로 간주한다. 전역객체 APIECMAScript에서는 전역객체의 API를 정의해두었다. 그 외의 API는 호스트 환경에서 필요에 따라서 추가로 정의하고 있다. 이를테면 웹브라우저 자바스크립트에서는 alert()이라는 전역객체의 메소드가 존재하지만 node.js에는 존재하지 않는다. 또한 전역객체의 이..
-
JavaScript 생성자와 newMOOC/생활코딩 2016. 4. 23. 20:28
2016.04.23. - 생성자 함수표현식 앞에 new가 붙어있으면 생성자라고 부르고 객체로 인식한다. 또한 리턴값도 객체를 반환한다. 생성자 내에서 객체의 프로퍼티를 적용함으로서 얻는 이득은 초기화라는 작업을 하여주므로 이를 통해서 코드의 재사용성이 매우 높아지므로 개발자 입장에서는 중복되는 코드들을 줄일수 있다. 생성자 함수는 일반 함수와 구분하기 위해서 첫 글자를 대문자로 표시하는것이 관례이다. 생성자함수는 자바스크립트 생성자의 특징으로 자바스크립트에서 객체를 만드는 주체는 함수이고 함수 앞에 new를 붙이는 점은 자바스크립트가 추구하는 자유로움을 알수있다. - 생성자 함수의 이름은 일반적으로 대문자로 시작- 생성자 함수 안에서 this 키워드로 생성자 함수로 생성될 객체의 속성을 지정- 생성자 함..
-
JavaScript 함수의 호출MOOC/생활코딩 2016. 4. 23. 17:21
2016.04.23. - 함수의 호출 함수를 호출하는 가장 기본적인 방법 123function func(){}func();cs 1234567891011o1 = {val1:1, val2:2, val3:3}o2 = {v1:10, v2:50, v3:100, v4:25}function sum(){ var _sum = 0; for(name in this){ _sum += this[name]; } return _sum;}alert(sum.apply(o1)) // 6alert(sum.apply(o2)) // 185cs 두개의 객체를 만들어 각자 3개와 4개의 속성을 가지고 있는 o1, o2로 정의하였다. 다음으로는 함수 sum을 생성하는데 객체의 속성을 열거 할 떄 사용하는 for in 문을 사용하여 객체 자신(th..
-
JavaScript ArgumentsMOOC/생활코딩 2016. 4. 22. 22:08
2016.04.22. - Arguments .length를 통해서 이 객체를 포함하고 있는 함수가 몇 개의 인자를 가지고 있는지 알 수 있다.arguments 안의 대괄호를 통하여 각자 인자의 특정한 자릿수의 값을 알아낼 수 있다. 123456789function sum(){ var i, _sum = 0; for(i = 0; i arguments는 함수안에서 사용할 수 있도록 그 이름이나 특성이 약속되어 있는 일종의 배열이다. arguments[0]은 함수로 전달된 첫번째 인자를 알아낼 수 있다. 또 arguments.length를 이용해서 함수로 전달된 인자의 개수를 알아낼 수도 있다. 이러한 특성에 반복문을 결합하면 함수로 전달된 인자의 값을 순차적으로 가져올 수 있다. 그 값을 더해서 리턴하면 인자..
-
JavaScript 클로저MOOC/생활코딩 2016. 4. 21. 22:38
2016.04.21. - 클로저 클로저(closure)는 내부함수가 외부함수의 맥락(context)에 접근할 수 있는 것을 가르킨다. 클로저는 자바스크립트를 이용한 고난이도의 테크닉을 구사하는데 필수적인 개념으로 활용된다. 12345678function outter(){ function inner(){ var title = 'Hello World JavaScript Closer'; alert(title); } inner();}outter();Colored by Color Scriptercs 자바스크립트는 함수 안에서 또 다른 함수를 선언할 수 있다. 위의 코드는 내부함수에서 외부함수로의 지역변수에 접근하여 title변수의 내용을 출력할수 있다. 12345678function outter(){ var ti..