2013. 1. 27. 21:14
Languages/CoffeeScript
객체의 function으로 호출될 때 this. 값을 어떻게 줄여서 표현 하는지와 prototype 도 알아보자. 또한 extends를 어떻게 사용하는지도 알아본다
1) this.name = name 표현하기
- this. 을 @ 로 표현한다
// prototype.coffee ### function Dog (name) { this.name = name; } Dog.prototype.growl = function() { console.log("*growl*"); } r = new Dog("Dowon"); r.growl(); ### Dog = (name) -> @name = name # this.name = name d = new Dog 'Dowon' console.log d.name console.log '----same thing----' Dog2 = (@name) -> # 파라미터로 @name을 쓰면 위와 같은 표현임 d2 = new Dog2 'Dowon' console.log d2.name // 결과 D:\Development\coffeescript\3>coffee prototype Dowon ----same thing---- Dowon // prototype.js 컴파일 내역 (function() { var Dog, Dog2, d, d2; Dog = function(name) { return this.name = name; }; d = new Dog('Dowon'); console.log(d.name); console.log('----same thing----'); Dog2 = function(name) { this.name = name; }; d2 = new Dog2('Dowon'); console.log(d2.name); }).call(this);
- Tip : 만일 (function(){ 코딩내역 }).call(this) 을 없애고 싶다면 --bare 옵션을 사용하면 됨
2) prototype. 표현하기
- prototype. 을 :: 로 표현한다
// prototype2.coffee Dog = (@name) -> Dog.prototype.growl = -> console.log '*growl*' d = new Dog 'Dowon' d.growl() console.log '----same thing----' Dog2 = (@name) -> Dog2::growl = -> # :: 로 표현한다 console.log '*growl*' d2 = new Dog2 'Dowon' d2.growl() //결과 D:\Development\coffeescript\3>coffee prototype2 *growl* ----same thing---- *growl* // 컴파일 내역 : prototype2.js // Generated by CoffeeScript 1.4.0 (function() { var Dog, Dog2, d, d2; Dog = function(name) { this.name = name; }; Dog.prototype.growl = function() { return console.log('*growl*'); }; d = new Dog('Dowon'); d.growl(); console.log('----same thing----'); Dog2 = function(name) { this.name = name; }; Dog2.prototype.growl = function() { return console.log('*growl*'); }; d2 = new Dog2('Dowon'); d2.growl(); }).call(this);
3) 상속에 대한 표현
- extends 를 통하여 상속받기
// extend.coffee Dog = (@name) -> Dog.prototype.growl = -> console.log '*growl*' BorderCollie = (@name, @tricks) -> BorderCollie extends Dog BorderCollie::perform = (trick) -> if trick in @tricks console.log "#{@name} is #{trick}" else console.log '*whine*' dowon = new BorderCollie 'Dowon', ['playing dead', 'catching', 'rolling'] dowon.perform 'catching' dowon.growl() // 결과 D:\Development\coffeescript\3>coffee extend Dowon is catching *growl* // 컴파일 내역 : extend.js // Generated by CoffeeScript 1.4.0 (function() { var BorderCollie, Dog, dowon, __hasProp = {}.hasOwnProperty, __extends = function(child, parent) { for (var key in parent) { if (__hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; }, __indexOf = [].indexOf || function(item) { for (var i = 0, l = this.length; i < l; i++) { if (i in this && this[i] === item) return i; } return -1; }; Dog = function(name) { this.name = name; }; Dog.prototype.growl = function() { return console.log('*growl*'); }; BorderCollie = function(name, tricks) { this.name = name; this.tricks = tricks; }; __extends(BorderCollie, Dog); BorderCollie.prototype.perform = function(trick) { if (__indexOf.call(this.tricks, trick) >= 0) { return console.log("" + this.name + " is " + trick); } else { return console.log('*whine*'); } }; dowon = new BorderCollie('Dowon', ['playing dead', 'catching', 'rolling']); dowon.perform('catching'); dowon.growl(); }).call(this);
@ :: extends 를 익히자 ^^
'Languages > CoffeeScript' 카테고리의 다른 글
[CoffeeScript] 문법 사용하기 (5) - regex, html (0) | 2013.01.29 |
---|---|
[CoffeeScript] 문법 사용하기 (4) - class, extends (0) | 2013.01.27 |
[CoffeeScript] 문법 사용하기 (2) - 조건, 반복문 (0) | 2013.01.24 |
[CoffeeScript] 문법 사용하기 (1) (0) | 2013.01.24 |
[CoffeeScript] 설치하고 간단 사용하기 (0) | 2013.01.24 |