JavaScript - From DHTML to a Multi-Paradigm Language

Transcript

1. 1.

   JavaScript From DHTML to a Multi-Paradigm Language Robert Vogt #NCamp16

2. 2.

   Robert Vogt Software Engineer from & in Sankt Gallen @_deniaz

3. 3.

   None
4. 4.

   «Web 2.0 describes World Wide Web websites that emphasize user-generated

   content, usability, and interoperability for end users.»
5. 5.

   jQuery MooTools Prototype JS script.aculo.us

6. 6.

   Single-page application

7. 7.

   Angular React Object-Oriented Functional

8. 8.

   None
9. 9.

   JavaScript

10. 10.

    «A programming paradigm is a style or way of programming.

    Some languages make it easy to write in some paradigms but not others.»
11. 11.

    «Object-oriented programming is a programming language model organized around objects

    rather than actions and data rather than logic.»
12. 12.

    class Dog extends Animal {} let dog = new Dog();

    dog.walk();
13. 13.

    let Animal = { walk: function() {} }; let Dog

    = Object.create(Animal); Dog.bark = function() { return ‘Woof!’; };
14. 14.

    Class-based Inheritance Prototypical Inheritance

15. 15.

    «Functional Programming is a programming paradigm that treats computation as

    the evaluation of mathematical functions and avoids changing-state and mutable data.»
16. 16.

    Functions First-Class

17. 17.

    let sum = function(a, b) { return a + b;

    }
18. 18.

    Functions Higher-Order

19. 19.

    $.get( 'http://example.com', (data) => { /* Success! */ } );

20. 20.

    function createPrinter(a, b) { return function() { return ‘Namics’; }

    } const print = createPrinter(); print(); // Namics.
21. 21.

    Functions Pure

22. 22.

    let double = (x) = x * 2;

23. 23.

    Closures Function

24. 24.

    let incrementer = (function() { let _value = 0; return

    () => ++_value; })(); incrementer(); // 1 incrementer(); // 2 incrementer(); // 3
25. 25.

    Data Immutable

26. 26.

    const list1 = Immutable.List.of(1, 2); const list2 = list1.push(3, 4,

    5);
27. 27.

    Composition Function

28. 28.

    let ten = double(sum(2, 3));

29. 29.

    Soooo… Any Real World Examples?

30. 30.

    None
31. 31.

    Store View Action Action Dispatcher

32. 32.

    const HelloMessage = (props) => ( <div>Hello {props.name}</div> );

33. 33.

    «Those who are unaware they are walking in darkness will

    never seek light.» — Bruce Lee find me on twitter @_deniaz