SlideShare una empresa de Scribd logo
1 de 28
それ、CoffeeScriptで
簡単に書けるよ(仮)
    @hidesuke
hidesuke (表)
  • ISPとかネトゲ屋さんで
    スマホ向けゲームを作っ
    ている人
  • ここ2年間くらい仕事で
    特殊なjsしか書いてない
   – Sencha Touch
   – ngGame
   – node.js
   – Unity
Osaki.js
• 会社の有志で集まって楽しくプログラミ
  ングする会
• 別名:『enchant.js部』
hidesuke (裏)
• シャチクミィという同人
  サークルで社畜グッズを
  作っている
• http://please.shachiku.me/
CoffeeScript
CoffeeScript
• JSにコンパイル(変換?)して使う
• Better JavaScript
 – JavaScriptの悪いところの多くが解決してい
   る
 – JSのバッドノウハウとかいちいち覚えてられ
   ん
• 簡潔な記述
• とても小さな言語なのですぐ覚えること
  ができる
詳しくはググれ
で、
今日は
クロージャ
   の話をします。
CoffeeScript +
   enchant.js
        で
   気持ちよく
クロージャが書けた話
クロージャ

クロージャはある関数全体が他の関数(以下、エ
ンクロージャ)の内部で宣言されたときに発生し、
内部の関数はエンクロージャのローカル変数(レ
キシカル変数)を参照する。実行時に外部の関数
が実行された際、クロージャが形成される。ク
ロージャは内部の関数のコードとエンクロージャ
のスコープ内の必要なすべての変数への参照から
なる。

              -- Wikipediaより
なるほど、まったくわからん。
わかりやすい解説が!
で、
ある日、
enchant.jsと
きゃっきゃうふふ
してるときに
気付いた
シューティングゲームのN連射弾
かク
けロ
るー
!ジ
 ャ
 で
クロージャで書いてみた




   ご自慢のクロージャ部分
解説(クロージャ部分)
弾の種類を表すcallback関   N連発の指定
     数             初期値はn = 5




                        弾が発射される間隔のフレーム数
                           初期値は10フレーム




                   条件を満たすと弾を発射する
前の弾をうってからの         関数を戻り値として返却する
  経過フレーム数
解説(呼び出し部分)

             this.curtainFire(さっきのクロージャが返却した
             関数)が定義されていれば毎フレーム呼び出す




                   さっきのクロージャにわたす
                   Callback関数(弾を作ってSceneに追加する)

180フレームに一回、クロージャを呼び
          出す
    弾を打つ関数を作ってもらう
N連射弾がうてた!
JSで書いたらこうなった
まとめ
• かるい気持ちでCoffeeScriptとか発言する
  と刺される
• クロージャは全然怖くない
• https://github.com/hidesuke/danmaku.enc
  hant.js
まとめ
• かるい気持ちでCoffeeScriptとか発言する
  と刺される
• クロージャは全然怖くない
• https://github.com/hidesuke/danmaku.enc
  hant.js
宿題
• 『slideshare hidesuke』 でググる
• 『CoffeeScript』でググる
• 『猿でもわかるクロージャ』でググる




             私にもクロージャ
             が書ける!
参考文献
• CoffeeScript
   – http://coffeescript.org/
• CoffeeScript入門 – プログラムdeタマゴ
   – http://d.hatena.ne.jp/nodamushi/20110108/1294518316
• [JavaScript] 猿でもわかるクロージャ超入門 まとめ - DQNEO
  起業日記
   – http://dqn.sakusakutto.jp/2009/01/javascript_5.html
• スライド中の画像は以下を使わせていただきました
   – http://simapantu.blog130.fc2.com/blog-entry-140.html
• Osaki.js (ステマ)
   – http://osakijs.blogspot.jp/

Más contenido relacionado

La actualidad más candente

La actualidad más candente (20)

Node.jsでサーバプログラマ デビューしよう
Node.jsでサーバプログラマ デビューしようNode.jsでサーバプログラマ デビューしよう
Node.jsでサーバプログラマ デビューしよう
 
やってよかったOS作り
やってよかったOS作りやってよかったOS作り
やってよかったOS作り
 
Parascript
ParascriptParascript
Parascript
 
グラフ解析で社長の脳内さらす!
グラフ解析で社長の脳内さらす!グラフ解析で社長の脳内さらす!
グラフ解析で社長の脳内さらす!
 
As you like, PHP on Azure - お気に召すままに!
As you like, PHP on Azure - お気に召すままに!As you like, PHP on Azure - お気に召すままに!
As you like, PHP on Azure - お気に召すままに!
 
20131012 nodejs
20131012 nodejs20131012 nodejs
20131012 nodejs
 
LT#7 Hello coffeeしてきた
LT#7 Hello coffeeしてきたLT#7 Hello coffeeしてきた
LT#7 Hello coffeeしてきた
 
Gatsby.js完全に理解した
Gatsby.js完全に理解したGatsby.js完全に理解した
Gatsby.js完全に理解した
 
20150523
 20150523 20150523
20150523
 
PHPのキャッシュを使いこなせ!
PHPのキャッシュを使いこなせ!PHPのキャッシュを使いこなせ!
PHPのキャッシュを使いこなせ!
 
JSでファミコンエミュレータを作った時の話
JSでファミコンエミュレータを作った時の話JSでファミコンエミュレータを作った時の話
JSでファミコンエミュレータを作った時の話
 
「Webサービスのつくり方」 のつくり方
「Webサービスのつくり方」 のつくり方「Webサービスのつくり方」 のつくり方
「Webサービスのつくり方」 のつくり方
 
UZTextView, UZMultilayeredPopoverControllerの解説
UZTextView, UZMultilayeredPopoverControllerの解説UZTextView, UZMultilayeredPopoverControllerの解説
UZTextView, UZMultilayeredPopoverControllerの解説
 
サーバ擬人化ユーザ会Lt資料 qpstudy lite
サーバ擬人化ユーザ会Lt資料 qpstudy liteサーバ擬人化ユーザ会Lt資料 qpstudy lite
サーバ擬人化ユーザ会Lt資料 qpstudy lite
 
アセット作成のワークフロー
アセット作成のワークフローアセット作成のワークフロー
アセット作成のワークフロー
 
Vagrant chef
Vagrant chefVagrant chef
Vagrant chef
 
SaCSS vol.63 動的なサイトの開発でgulpとBrowserSyncを使ってみる
SaCSS vol.63 動的なサイトの開発でgulpとBrowserSyncを使ってみるSaCSS vol.63 動的なサイトの開発でgulpとBrowserSyncを使ってみる
SaCSS vol.63 動的なサイトの開発でgulpとBrowserSyncを使ってみる
 
2009 02 12_flosss_cms解体ショー
2009 02 12_flosss_cms解体ショー2009 02 12_flosss_cms解体ショー
2009 02 12_flosss_cms解体ショー
 
GUI何処行ったんDocker
GUI何処行ったんDockerGUI何処行ったんDocker
GUI何処行ったんDocker
 
八王子
八王子八王子
八王子
 

Destacado

Destacado (17)

深層学習生き地獄
深層学習生き地獄深層学習生き地獄
深層学習生き地獄
 
俺のtensorが全然flowしないのでみんなchainer使おう by DEEPstation
俺のtensorが全然flowしないのでみんなchainer使おう by DEEPstation俺のtensorが全然flowしないのでみんなchainer使おう by DEEPstation
俺のtensorが全然flowしないのでみんなchainer使おう by DEEPstation
 
NVIDIA 更新情報: Tesla P100 PCIe/cuDNN 5.1
NVIDIA 更新情報: Tesla P100 PCIe/cuDNN 5.1NVIDIA 更新情報: Tesla P100 PCIe/cuDNN 5.1
NVIDIA 更新情報: Tesla P100 PCIe/cuDNN 5.1
 
Web GLの話
Web GLの話Web GLの話
Web GLの話
 
Kivy with-redux
Kivy with-reduxKivy with-redux
Kivy with-redux
 
CEDEC2016 「コントラスト」で考えるゲームデザイン・レベルデザイン
CEDEC2016 「コントラスト」で考えるゲームデザイン・レベルデザインCEDEC2016 「コントラスト」で考えるゲームデザイン・レベルデザイン
CEDEC2016 「コントラスト」で考えるゲームデザイン・レベルデザイン
 
Chainerの使い方と 自然言語処理への応用
Chainerの使い方と自然言語処理への応用Chainerの使い方と自然言語処理への応用
Chainerの使い方と 自然言語処理への応用
 
GPU上でのNLP向け深層学習の実装について
GPU上でのNLP向け深層学習の実装についてGPU上でのNLP向け深層学習の実装について
GPU上でのNLP向け深層学習の実装について
 
On the benchmark of Chainer
On the benchmark of ChainerOn the benchmark of Chainer
On the benchmark of Chainer
 
Deep parking
Deep parkingDeep parking
Deep parking
 
深層学習ライブラリの環境問題Chainer Meetup2016 07-02
深層学習ライブラリの環境問題Chainer Meetup2016 07-02深層学習ライブラリの環境問題Chainer Meetup2016 07-02
深層学習ライブラリの環境問題Chainer Meetup2016 07-02
 
ヤフー音声認識サービスでのディープラーニングとGPU利用事例
ヤフー音声認識サービスでのディープラーニングとGPU利用事例ヤフー音声認識サービスでのディープラーニングとGPU利用事例
ヤフー音声認識サービスでのディープラーニングとGPU利用事例
 
マシンパーセプション研究におけるChainer活用事例
マシンパーセプション研究におけるChainer活用事例マシンパーセプション研究におけるChainer活用事例
マシンパーセプション研究におけるChainer活用事例
 
Chainer Update v1.8.0 -> v1.10.0+
Chainer Update v1.8.0 -> v1.10.0+Chainer Update v1.8.0 -> v1.10.0+
Chainer Update v1.8.0 -> v1.10.0+
 
Chainer, Cupy入門
Chainer, Cupy入門Chainer, Cupy入門
Chainer, Cupy入門
 
Deep Learningと画像認識   ~歴史・理論・実践~
Deep Learningと画像認識 ~歴史・理論・実践~Deep Learningと画像認識 ~歴史・理論・実践~
Deep Learningと画像認識   ~歴史・理論・実践~
 
Chainerを使って細胞を数えてみた
Chainerを使って細胞を数えてみたChainerを使って細胞を数えてみた
Chainerを使って細胞を数えてみた
 

Similar a CoffeeScript+enchant.jsでクロージャが気持よくかけた話

F#+Erlangで簡単なシューティングゲームを作ってみている
F#+Erlangで簡単なシューティングゲームを作ってみているF#+Erlangで簡単なシューティングゲームを作ってみている
F#+Erlangで簡単なシューティングゲームを作ってみている
pocketberserker
 
メガ Unity ユーザーミートアップ 2012
メガ Unity ユーザーミートアップ 2012メガ Unity ユーザーミートアップ 2012
メガ Unity ユーザーミートアップ 2012
cfm_art
 

Similar a CoffeeScript+enchant.jsでクロージャが気持よくかけた話 (20)

zxでシェルスクリプトから逃げよう ~javascriptでシェルを書く~
zxでシェルスクリプトから逃げよう ~javascriptでシェルを書く~zxでシェルスクリプトから逃げよう ~javascriptでシェルを書く~
zxでシェルスクリプトから逃げよう ~javascriptでシェルを書く~
 
JavaScript 非同期処理 入門
JavaScript非同期処理 入門JavaScript非同期処理 入門
JavaScript 非同期処理 入門
 
F#+Erlangで簡単なシューティングゲームを作ってみている
F#+Erlangで簡単なシューティングゲームを作ってみているF#+Erlangで簡単なシューティングゲームを作ってみている
F#+Erlangで簡単なシューティングゲームを作ってみている
 
資料
資料資料
資料
 
Cli mini Hack!#1 ~Terminalとの親睦を深めよう~
Cli mini Hack!#1 ~Terminalとの親睦を深めよう~Cli mini Hack!#1 ~Terminalとの親睦を深めよう~
Cli mini Hack!#1 ~Terminalとの親睦を深めよう~
 
メガ Unity ユーザーミートアップ 2012
メガ Unity ユーザーミートアップ 2012メガ Unity ユーザーミートアップ 2012
メガ Unity ユーザーミートアップ 2012
 
フロント作業の効率化
フロント作業の効率化フロント作業の効率化
フロント作業の効率化
 
桐島、Rubyやめるってよ
桐島、Rubyやめるってよ桐島、Rubyやめるってよ
桐島、Rubyやめるってよ
 
Web制作勉強会 #2
Web制作勉強会 #2Web制作勉強会 #2
Web制作勉強会 #2
 
Hello, C++ + JavaScript World! - Boost.勉強会 #11 東京
Hello, C++ + JavaScript World! - Boost.勉強会 #11 東京Hello, C++ + JavaScript World! - Boost.勉強会 #11 東京
Hello, C++ + JavaScript World! - Boost.勉強会 #11 東京
 
60fpsアクションを実現する秘訣を伝授 基礎編
60fpsアクションを実現する秘訣を伝授 基礎編60fpsアクションを実現する秘訣を伝授 基礎編
60fpsアクションを実現する秘訣を伝授 基礎編
 
Cocos2d-JSと物理演算で作る横スクロールアクションゲーム #scripty06
Cocos2d-JSと物理演算で作る横スクロールアクションゲーム #scripty06Cocos2d-JSと物理演算で作る横スクロールアクションゲーム #scripty06
Cocos2d-JSと物理演算で作る横スクロールアクションゲーム #scripty06
 
俺のZabbixがこんなに可愛いわけがない(おかわり)
俺のZabbixがこんなに可愛いわけがない(おかわり) 俺のZabbixがこんなに可愛いわけがない(おかわり)
俺のZabbixがこんなに可愛いわけがない(おかわり)
 
⑯jQueryをおぼえよう!その2
⑯jQueryをおぼえよう!その2⑯jQueryをおぼえよう!その2
⑯jQueryをおぼえよう!その2
 
Shiva 〜Nextremerをscale upする機械学習環境〜
Shiva 〜Nextremerをscale upする機械学習環境〜Shiva 〜Nextremerをscale upする機械学習環境〜
Shiva 〜Nextremerをscale upする機械学習環境〜
 
PlayFramework1.x基礎編
PlayFramework1.x基礎編PlayFramework1.x基礎編
PlayFramework1.x基礎編
 
SmartNews TechNight Vol5 : SmartNews AdServer 解体新書 / ポストモーテム
SmartNews TechNight Vol5 : SmartNews AdServer 解体新書 / ポストモーテムSmartNews TechNight Vol5 : SmartNews AdServer 解体新書 / ポストモーテム
SmartNews TechNight Vol5 : SmartNews AdServer 解体新書 / ポストモーテム
 
Javascript で暗号化
Javascript で暗号化Javascript で暗号化
Javascript で暗号化
 
Ruby で高速なプログラムを書く
Ruby で高速なプログラムを書くRuby で高速なプログラムを書く
Ruby で高速なプログラムを書く
 
俺とCI
俺とCI俺とCI
俺とCI
 

Más de Yusuke HIDESHIMA

継続的デリバリー第11章.Ppt
継続的デリバリー第11章.Ppt継続的デリバリー第11章.Ppt
継続的デリバリー第11章.Ppt
Yusuke HIDESHIMA
 

Más de Yusuke HIDESHIMA (9)

「アレクサ、"リーフスキル"の作り方を教えて」
「アレクサ、"リーフスキル"の作り方を教えて」「アレクサ、"リーフスキル"の作り方を教えて」
「アレクサ、"リーフスキル"の作り方を教えて」
 
文藝バトルイベント「かきあげ!」のご紹介
文藝バトルイベント「かきあげ!」のご紹介文藝バトルイベント「かきあげ!」のご紹介
文藝バトルイベント「かきあげ!」のご紹介
 
継続的デリバリー読書会 14章
継続的デリバリー読書会 14章継続的デリバリー読書会 14章
継続的デリバリー読書会 14章
 
(Unityよくわかってない人のための)なんとなくわかるかもしれないAssetBundle
(Unityよくわかってない人のための)なんとなくわかるかもしれないAssetBundle(Unityよくわかってない人のための)なんとなくわかるかもしれないAssetBundle
(Unityよくわかってない人のための)なんとなくわかるかもしれないAssetBundle
 
第2回 某社Arduino勉強会 ハンズオン
第2回 某社Arduino勉強会 ハンズオン第2回 某社Arduino勉強会 ハンズオン
第2回 某社Arduino勉強会 ハンズオン
 
継続的デリバリー第11章.Ppt
継続的デリバリー第11章.Ppt継続的デリバリー第11章.Ppt
継続的デリバリー第11章.Ppt
 
継続的デリバリー読書会資料 #1
継続的デリバリー読書会資料 #1継続的デリバリー読書会資料 #1
継続的デリバリー読書会資料 #1
 
(業務外)ゲーム制作部のススメ
(業務外)ゲーム制作部のススメ(業務外)ゲーム制作部のススメ
(業務外)ゲーム制作部のススメ
 
Osakijs #01 「enchant.jsハンズオン資料」
Osakijs #01 「enchant.jsハンズオン資料」Osakijs #01 「enchant.jsハンズオン資料」
Osakijs #01 「enchant.jsハンズオン資料」
 

Último

Último (7)

Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その22024/04/26の勉強会で発表されたものです。
 
新人研修 後半 2024/04/26の勉強会で発表されたものです。
新人研修 後半        2024/04/26の勉強会で発表されたものです。新人研修 後半        2024/04/26の勉強会で発表されたものです。
新人研修 後半 2024/04/26の勉強会で発表されたものです。
 
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアルLoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
LoRaWAN スマート距離検出デバイスDS20L日本語マニュアル
 
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
業務で生成AIを活用したい人のための生成AI入門講座(社外公開版:キンドリルジャパン社内勉強会:2024年4月発表)
 
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
Amazon SES を勉強してみる その32024/04/26の勉強会で発表されたものです。
 
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
LoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイスLoRaWANスマート距離検出センサー  DS20L  カタログ  LiDARデバイス
LoRaWANスマート距離検出センサー DS20L カタログ LiDARデバイス
 
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
NewSQLの可用性構成パターン(OCHaCafe Season 8 #4 発表資料)
 

CoffeeScript+enchant.jsでクロージャが気持よくかけた話