Please enable JavaScript.

Coggle requires JavaScript to display documents.

Javascript (ES6 / ES2015 (array (Spread Operator (append to new array ([..…

- - - - npm install -g babel-cli
      - touch .babelrc
        
        JSON Datei
        
        Konfiguration
  - - - editor warns
      - babel throws error
    - - never use var again ! :check:
    - - like for-loops or if statement
      - function scope
  - - - wenn single expression zurückgegeben wird
      - const squareArrow = (x) => x * x;
      - keine geschweifte Klammer
      - kein return notwendig
    - - no longer bound to arrow functions :black_flag:
      - object enthält in ES5 alle parameter
    - - no longer bund to arrow functions :black_flag:
      - workaround like const that = this not necessary anymore :smiley:
      - bei Objektmethoden kann man this nur mit ES5 functions verwenden :!:
        
        es gibt aber die ES6 Method Definition Syntax
        
        es6MethodFunction() {...}
        
        hat die gleiche Charakteristik wie ES5 functions
        
        es5ObjectMethod: function() {..}
  - - - map instead of forEach
      - const newArray = oldArray.map(value) => {return value;}
      - erlaubt die Transformation eines items
    - - const [ age, gender ] = ['28', male]
    - - Array.find()
      - Array.findIndex()
    - - spread out all of the items to the current array
      - [...myArray]
      - append to new array
        
        [...myArray, 'Mike']
        
        ['Mary', ...myArray, 'Mike']
      - it will not change the current array :star:
    - - check if an element exist
  - - - optional
      - es6 meta definintion syntax
        
        constructor(arg1, arg2, ..) { ...}
        
        this refers to class instance
      - es6 function defaults
        
        constructor(name = 'Anonymous')
    - - inheritance
      - overwrite constructor function
        
        defaults not inheritated
        
        super(arg1, arg2) is necessary
        
        calls the parent class
        
        add new constructor values only
      - can overwrite methods with same name
  - - - error
      - when the same name
  - - - Properties to variables
      - const { age, gender } = person;
      - renaming variables possible
        
        const { age , gender:newVariableName } = person;
    - - creates new Object with Items from existing one
      - its an edge technologie :!: not generally supported at the moment. :black_flag:
        
        babel-plugin
        
        yarn add babel-plugin-transform-object-rest-spread@6.23.0
        
        .babelrc
        
        plugins: transform-object-rest-spread
      - {...user, job: 'Developer'}
      - can overwrite new properties in front
        
        {age: 27, ...user}
  - - - does string exist inside an other string
      - str.includes(searchString[, position])
      - like InStr
      - Case sensitive :!:
- - - - Initalisierung mit undefined
      - Funktionen sind bekannt
    - - Pass1: declaration are located and identifieres known
      - Pass2: execution
  - - - for loop
        
        use variable for caching
    - - filter
    - - map
      - concat
    - - reduce
    - - push
    - - arr.sort()
      - arr.sort([compareFunction])
        
        -1 = a < b
        
        1 = a > b
        
        0 = a = b
  - - - Iteration
        
        for-in
      - Attribute
        
        writable
        
        Wenn Wert = Object zusätzlich freeze verwenden
        
        Schreibrecht für Wert
        
        Strict Mode unbedingt nutzen !
        
        leichter zu debuggen
        
        Fehlerausgabe Browser Console
        
        configurable
        
        Steuert Änderungsrecht für Attribute
        
        writable ist immer änderbar ! :!:
        
        Schütz vor Löschung im Objekt
        
        enumerable :
        
        Steuert Darstellung bei Iteration
        
        Getters and Setters
        
        Object.defineProperty
      - Protoypes
        
        function
        
        prototype
        
        Objekinstanz die als prototype für alle mit der Funktion erstellen Objekte verwendet wird
        
        object
        
        _ proto _
        
        Objektinstanz von der das Objekt geerbt wird
    - - Object Literal
      - Constructor Function
      - ES6 class
      - Object.create
  - - - default: global object
      - im Browser: window object
      - object dass den Code ausführt ! :warning:
      - in constructor function besser Kopie von this verwenden: var _this = this
  - - - kann einer Variable zugewiesen werden
        
        function expression
        
        kein Hoisting, da Variable
    - - anonymous function
        
        callback hell
        
        führt zur Verschachtelung
      - named functions
        
        übersichtlicher
        
        keine Verschachtelung
      - exit
        
        done(err, result)
        
        empfohlen: return done(...) verwenden
      - error handling
        
        immer callback(err, result)
        
        if(err) { return done(err, null); }
  - - - https://www.promisejs.org/
- - - - alles hängt am global object
      - im Browser: window object
      - Vermeidung Namenskollision
  - - - Mehrere Wörter: Upper Camel Case
      - Constructor
      - "new" erforderlich
      - Objekt
    - - Funktionen
      - Methoden
      - Mehrere Wörter: Lower Camel Case
      - "new" NICHT erforderlich
      - Variablen
    - - Konstanten
      - Mehrere Wörter: Getrennt mit Unterstrich
  - - - Wörter trennen mit Bindestrich
      - immer lowercase