Looking back on JavaScript

GMO pepabo Tech Meeting/Hosting#3 で話した資料です

Transcript

1. ͳΜͱͳ͘+4ॻ͍ͯΔਓ΁
   5PNPIJTB0EB(.01FQBCP *OD
   5FDI.FFUJOH)PTUJOH
   +BWB4DSJQUͷ;Γ͔͑Γձ
   

   View Slide

2. ϓϦϯγύϧΤϯδχΞ
   5PNPIJTB0EB!MJOZPXT
   ٕज़෦ٕज़ج൫νʔϜ
   

   View Slide

3. ͓΅͍͑ͯ·͔͢ʁ
   

   View Slide

4. 'BOJDઑͬͯ·ͨ͠ʢ౰࣌
   wϦΞϧλΠϜը૾ม׵ʢࠓͱͳͬͯ͸ී௨
   w''NQFHϥούʔͰNQɺBBD౳૬ޓม׵KPC
   wTͷϦιʔεΰϛߴ଎࡟আKPC
   ౳ʑɺ/PEFKTΛ༻͍ͯΠϕϯτϧʔϓϊϯϒϩοΩ
   ϯάΛ׆༻͍ͯͨ͠
   

   View Slide

5. ͜Μͳํ͕ର৅Ͱ͢
   wK2VFSZΛͱΓ͋͑ͣ࢖ͬͯ·͢Α
   wQSPUPUZQFͬͯԿɺK2VFSZͷલʹྲྀߦͬͨ΍ͭʁ
   w&$."4DSJQUʁॳΊͯฉ͖·ͨ͠
   

   View Slide

6. XFCΞϓϦέʔγϣϯ։ൃͯ͠Δ
   ͕ɺKT͕ϝΠϯ͡Όͳ͍
   

   View Slide

7. ͳΜͱͳ͘+4ॻ͍ͯ·͢ʂ
   

   View Slide

8. +BWB4DSJQUͷ͜Ε·ͰམͪͿΕ
   w೥୅ॳ಄ϒϥ΢βͱͱ΋ʹ஀ੜ
   w&$."ઃཱʢ+TDSJQUͱ+BWB4DSJQUޓ׵΁ͷಈ͖ʣ
   wͱ͜Ζ͕ҙݟ͕·ͱ·Βͳ͍
   wͦͷؒʹ"DUJPO4DSJQUͷ'MBTI͕޿·Δ
   w/BUJWF+4ͳΜͯཁΒΜͷ͡Όͱ͍͏งғؾʜաڈͷ΋ͷ΁
   

   View Slide

9. +BWB4DSJQUͷ͜Ε·Ͱ࠶ͼ
   w೥(PPHMF.BQͰ"KBY͕ར༻͞Ε+4͕࠶ͼ஫໨Λ͋ͼ࢝ΊΔ
   w೥$ISPNFͱͱ΋ʹWNܕͰߴ଎ͳ+4Τϯδϯ7͕ެ։͞ΕΔ
   w೥7Λ࢖ͬͨαʔόαΠυͷSVOUJNF/PEFKT͕஀ੜ͢Δ
   w೥ࠒ͔Β#BDLCPOFKTච಄ʹ"OHVMBS+4΍3FBDU΍7VFKTͳͲ
   ͷ૒ํ޲όΠϯσΟϯάϑϨʔϜϫʔΫ͕ొ৔͍ͯ͘͠
   w೥&$."4DSJQUUIFEJUJPO͕ެ։͞ΕΔ
   

   View Slide

10. ૒ํ޲σʔλόΠϯσΟϯάͱ͸
    w6*ͱσʔλͷ૒ํ޲Ͱ৘ใʢมԽʣΛڞ༗͢Δ
    w6*ʢJOQVUʣΛมߋͨ͠Βσʔλʹ൓ө͠ɺσʔλ͕ߋ৽͞ΕͨΒ6*
    ͕มԽ
    w۩ମతʹ͸WJFXNPEFM૒ํ޲Ͱ΍ΓͱΓ͢Δ
    

    View Slide

11. &$."4DSJQUUIFEJUJPO
    w͍ΘΏΔ&4&4
    wݴޠ࢓༷Λ࠶ఆٛ
    wࠓޙԿ೥͸όάमਖ਼ͱখ͞ͳػೳ௥ՃͰຖ೥ϦϦʔε
    w͜Εʹ߹Θͤɺαʔόͱϒϥ΢βͷ+4͕౷߹ʹ޲
    ͔͍ͬͯΔʁ͸ͣ
    

    View Slide

12. &4ͬͯ࢖͑Δͷ
    w&4͕΋͏͙͢ʜ
    w֤αʔϏεͷޓ׵දIUUQLBOHBYHJUIVCJP
    DPNQBUUBCMFFT
    wओཁϒϥ΢βɺ࠷৽/PEFKTͰ΄΅ରԠࡁΈͳͷͰେ
    ମ࢖͑Δͱݴ͑Δ
    wେମͳͷͰτϥϯεύΠϧ΍Δͷ͕ແ೉
    

    View Slide

13. 5SBOTQJMF
    τϥϯεύΠϥ
    w#BCFM
    w#VCMF
    τϥϯεύΠϧ͕ඞཁͳݴޠ
    w5ZQF4DSJQU
    w$P⒎FF4DSJQU
    

    View Slide

14. Ͱɺ&4͸Կ͕͏Ε͍͠ͷʁ
    

    View Slide

15. &4Ͱ͏Ε͍͜͠ͱ
    wQSPUPUZQFϕʔεͰઃܭ͠ͳͯ͘ྑ͘ͳΔDMBTTͱ
    FYUFOET
    w͖Ε͍ͳTZOUBYʢBSSPXGVODUJPO΍QSPNJTFʜ ʣ
    w4ZNCPM΍Β.BQͳͲศརػೳ
    ৄ͘͠͸IUUQQPTUEDDFTDIFBUTIFFU
    

    View Slide

16. ʘͦ΋ͦ΋
    Α͘Θ͔Βͳ͍Ͱ͢
    ϓϩτλΠϓϕʔε
    ʢͪͳΈʹ๻͸޷͖Ͱ͢ʣ
    

    View Slide

17. Ͱ͢ΑͶ ??
    

    View Slide

18. ܧঝͷྫ function Employee() {
    this.name = "";
    this.dept = "general";
    }
    function Manager() {
    Employee.call(this);
    this.reports = [];
    }
    Manager.prototype = Object.create(Employee.prototype);
    function Worker() {
    Employee.call(this);
    this.projects = [];
    }
    Worker.prototype = Object.create(Employee.prototype);
    function Engineer() {
    Partner.call(this);
    this.dept = "engineering";
    }
    Engineer.prototype = Object.create(Worker.prototype);
    var opo = new Engineer();
    opo.dept; // => "enginneering"
    

    View Slide

19. ֦ுͷྫ
    function Point(x, y) {
    this.x = x;
    this.y = y;
    }
    var p = new Point(3, 4);
    p.x // => 3
    p.y // => 4
    Point.prototype.r = function() {
    return Math.sqrt((this.x * this.x) +
    (this.y * this.y));
    };
    p.r();
    

    View Slide

20. 
    

    View Slide

21. ײ૝
    wܧঝͱ͍͏ΑΓίϐʔʹ͍ۙ
    wந৅Խ͞Εͨ΋ͷͱ࣮ଶͷؔ܎͕ͳ͍શ࣮ͯଶ
    wͳͷͰΑΓૄ݁߹ͳΦϒδΣΫτ
    

    View Slide

22. ·ͱΊ
    w௕͍ྺ࢙Λܦͯ΍ͬͱҰ؏ੑ͕ग़͖ͯͭͭ͋Δ
    wͨͩ͠ɺա౉ظͳͷͰ༷ʑͳπʔϧ΍पลϥΠϒϥϦ
    ͕୔ࢁग़ݱͯ͠͸ফ͍͍͑ͯͬͯΔ
    wࠓ΋ͳ͓৽͍͠ϓϩϙʔαϧ͕HJUIVCʹ্͕͍ͬͯͯ
    มԽ͍ͯ͠Δதɺϒϥ΢β͔ΒαʔόαΠυ͸ͨ·ͨ
    ϞόΠϧ΋Χόʔ͢Δݴޠ͸ແࢹͰ͖ͳ͍ͷͰ͋Δ
    

    View Slide

23. ߈Ί͍ͯ͜͏+BWB4DSJQU
    

    View Slide

24. ܅΋αϩϯʹ͓͍Ͱʁ
    ࠷৽৘ใΛνΣοΫˠ !MJOZPXT
    

    View Slide

25. ͓ΘΓ
    

    View Slide