Samouczek JS

JS DOM Wprowadzenie do JS JS Dokąd Wyjście JS Oświadczenia JS Składnia JS Komentarze JS Zmienne JS JS Let JS Const Operatorzy JS Arytmetyka JS Zadanie JS Typy danych JS Funkcje JS Obiekty JS Wydarzenia JS JS Strings Metody ciągów JS Wyszukiwanie ciągów JS Szablony JS String Numery JS Metody liczbowe JS Tablice JS Metody tablic JS Sortowanie tablic JS Iteracja tablicy JS JS Array Const JS Daty Formaty daty JS JS Data Pobierz metody Metody ustawiania daty JS Matematyka JS JS losowo JS Booleans Porównania JS Warunki JS Przełącznik JS Pętla JS dla Pętla JS dla In Pętla JS dla Of Pętla JS, podczas gdy Przerwa JS Iterable JS Zestawy JS Mapy JS Typ JS Konwersja typu JS JS Bitwise JS RegExp Błędy JS Zakres JS JS Podnoszenie Tryb ścisły JS JS to słowo kluczowe Funkcja strzałki JS Klasy JS JS JSON Debugowanie JS Przewodnik po stylu JS Najlepsze praktyki JS Błędy JS Wydajność JS JS słowa zastrzeżone

Wersje JS

Wersje JS JS 2009 (ES5) JS 2015 (ES6) JS 2016 JS 2017 JS 2018 JS IE / Krawędź Historia JS

Obiekty JS

Definicje obiektów Właściwości obiektu Metody obiektowe Wyświetlanie obiektów Akcesoria do obiektów Konstruktorzy obiektów Prototypy obiektów Iterowalne obiekty Zestawy obiektów Mapy obiektów Odniesienie do obiektu

Funkcje JS

Definicje funkcji Parametry funkcji Wywołanie funkcji Wywołanie funkcji Funkcja Zastosuj Zamknięcia funkcji

Klasy JS

Wprowadzenie do zajęć Dziedziczenie klas Klasa statyczna

JS Async

Oddzwaniania JS Asynchroniczny JS JS Obietnice JS Async/Oczekiwanie

JS HTML DOM

Wprowadzenie do DOM Metody DOM Dokument DOM Elementy DOM DOM HTML Formularze DOM DOM CSS Animacje DOM Wydarzenia DOM Odbiornik zdarzeń DOM Nawigacja DOM Węzły DOM Kolekcje DOM Listy węzłów DOM

Zestawienie komponentów przeglądarki JS

Okno JS Ekran JS Lokalizacja JS Historia JS JS Navigator Wyskakujący alert JS Czas JS Pliki cookie JS

JS Web API

Wprowadzenie do internetowego interfejsu API Interfejs API formularzy internetowych Interfejs API historii online API przechowywania danych w sieci Web Web Worker API Internetowy interfejs API pobierania Internetowy interfejs API geolokalizacji

JS AJAX

Wprowadzenie do AJAX AJAX XMLHttp Żądanie AJAX Odpowiedź AJAX Plik XML AJAX AJAX PHP ASP AJAX Baza danych AJAX Aplikacje AJAX Przykłady AJAX

JS JSON

Wprowadzenie do JSON Składnia JSON JSON a XML Typy danych JSON Analiza JSON JSON Obiekty JSON Tablice JSON Serwer JSON JSON PHP JSON HTML JSON JSONP

JS kontra jQuery

Selektory jQuery jQuery HTML jQuery CSS jQuery DOM

Grafika JS

Grafika JS JS płótno JS Działka JS Chart.js Wykres JS Google JS D3.js

Przykłady JS

Przykłady JS JS HTML DOM Wejście JS HTML Obiekty HTML JS Wydarzenia JS HTML Przeglądarka JS Edytor JS Ćwiczenia JS JS Quiz Certyfikat JS

Referencje JS

Obiekty JavaScript Obiekty HTML DOM


ECMAScript 2017

Konwencja nazewnictwa JavaScript rozpoczęła się od ES1, ES2, ES3, ES5 i ES6.

Jednak ECMAScript 2016 i 2017 nie nosiły nazw ES7 i ES8.

Od 2016 nowe wersje są nazwane według roku (ECMAScript 2016 / 2017 / 2018).

Nowe funkcje w ECMAScript 2017

Ten rozdział przedstawia nowe funkcje w ECMAScript 2017:


Dopełnienie ciągu JavaScript

ECMAScript 2017 dodał dwie metody String: padStart oraz padEnddo obsługi dopełnienia na początku i na końcu ciągu.

Przykład

let str = "5";
str = str.padStart(4,0);
// result is 0005

Przykład

let str = "5";
str = str.padEnd(4,0);
// result is 5000

Dopełnianie ciągów nie jest obsługiwane w przeglądarce Internet Explorer.

Firefox i Safari były pierwszymi przeglądarkami obsługującymi dopełnienie ciągów JavaScript:

Chrome 57 Edge 15 Firefox 48 Safari 10 Opera 44
Mar 2017 Apr 2017 Aug 2016 Sep 2016 Mar 2017

Wpisy obiektów JavaScript

ECMAScript 2017 dodaje nową Object.entriesmetodę do obiektów.

Metoda Object.entries() zwraca tablicę par klucz/wartość w obiekcie:

Przykład

const person = {
  firstName : "John",
  lastName : "Doe",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.entries(person);

Object.entries() ułatwia używanie obiektów w pętlach:

Przykład

const fruits = {Bananas:300, Oranges:200, Apples:500};

let text = "";
for (let [fruit, value] of Object.entries(fruits)) {
text += fruit + ": " + value + "
";
}

Object.entries() ułatwia również konwersję obiektów na mapy:

Przykład

const fruits = {Bananas:300, Oranges:200, Apples:500};

const myMap = new Map(Object.entries(fruits));

Chrome i Firefox były pierwszymi przeglądarkami obsługującymi Object.entries:

Chrome 47 Edge 14 Firefox 47 Safari 10.1 Opera 41
Jun 2016 Aug 2016 Jun 2016 Mar 2017 Oct 2016

Wartości obiektów JavaScript

Object.valuessą podobne do Object.entries, ale zwraca pojedynczą tablicę wymiarów wartości obiektu:

Przykład

const person = {
  firstName : "John",
  lastName : "Doe",
  age : 50,
  eyeColor : "blue"
};
document.getElementById("demo").innerHTML = Object.values(person);

Firefox i Chrome były pierwszymi przeglądarkami obsługującymi Object.values:

Chrome 54 Edge 14 Firefox 47 Safari 10.1 Opera 41
Oct 2016 Aug 2016 Jun 2016 Mar 2017 Oct 2016


Funkcje asynchroniczne JavaScript

Czekam na limit czasu

async function myDisplay() {
  let myPromise = new Promise(function(myResolve, myReject) {
    setTimeout(function() { myResolve("I love You !!"); }, 3000);
  });
  document.getElementById("demo").innerHTML = await myPromise;
}

myDisplay();

Firefox i Chrome były pierwszymi przeglądarkami obsługującymi asynchroniczne funkcje JavaScript:

Chrome 55 Edge 15 Firefox 52 Safari 11 Opera 42
Dec 2016 Apr 2017 Mar 2017 Sep 2017 Dec 2016