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 macierzowe 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


Właściwości obiektu JavaScript


Właściwości są najważniejszą częścią każdego obiektu JavaScript.


Właściwości JavaScript

Właściwości to wartości związane z obiektem JavaScript.

Obiekt JavaScript to zbiór nieuporządkowanych właściwości.

Właściwości można zwykle zmieniać, dodawać i usuwać, ale niektóre są tylko do odczytu.


Dostęp do właściwości JavaScript

Składnia dostępu do właściwości obiektu to:

objectName.property      // person.age

lub

objectName["property"]   // person["age"]

lub

objectName[expression]   // x = "age"; person[x]

Wyrażenie musi być ocenione jako nazwa właściwości.

Przykład 1

person.firstname + " is " + person.age + " years old.";

Przykład 2

person["firstname"] + " is " + person["age"] + " years old.";


JavaScript dla... w pętli

Instrukcja JavaScript for...inprzechodzi przez właściwości obiektu.

Składnia

for (let variable in object) {
  // code to be executed
}

Blok kodu wewnątrz for...inpętli zostanie wykonany raz dla każdej właściwości.

Przeglądanie właściwości obiektu:

Przykład

const person = {
  fname:" John",
  lname:" Doe",
  age: 25
};

for (let x in person) {
  txt += person[x];
}

Dodawanie nowych właściwości

Możesz dodać nowe właściwości do istniejącego obiektu, po prostu nadając mu wartość.

Załóżmy, że obiekt person już istnieje - możesz wtedy nadać mu nowe właściwości:

Przykład

person.nationality = "English";

Usuwanie właściwości

Słowo deletekluczowe usuwa właściwość z obiektu:

Przykład

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person.age;

lub usuń osobę["wiek"];

Przykład

const person = {
  firstName: "John",
  lastName: "Doe",
  age: 50,
  eyeColor: "blue"
};

delete person["age"];

Słowo deletekluczowe usuwa zarówno wartość właściwości, jak i samą właściwość.

Usuniętej właściwości nie można używać, dopóki nie zostanie ponownie dodana.

Operator deletejest przeznaczony do stosowania we właściwościach obiektów. Nie ma wpływu na zmienne ani funkcje.

Operator deletenie powinien być używany na predefiniowanych właściwościach obiektu JavaScript. Może spowodować awarię Twojej aplikacji.


Obiekty zagnieżdżone

Wartości w obiekcie mogą być innym obiektem:

Przykład

myObj = {
  name:"John",
  age:30,
  cars: {
    car1:"Ford",
    car2:"BMW",
    car3:"Fiat"
  }
}

Możesz uzyskać dostęp do zagnieżdżonych obiektów za pomocą notacji kropkowej lub notacji nawiasowej:

Przykład

myObj.cars.car2;

lub:

Przykład

myObj.cars["car2"];

lub:

Przykład

myObj["cars"]["car2"];

lub:

Przykład

let p1 = "cars";
let p2 = "car2";
myObj[p1][p2];

Zagnieżdżone tablice i obiekty

Wartości w obiektach mogą być tablicami, a wartości w tablicach mogą być obiektami:

Przykład

const myObj = {
  name: "John",
  age: 30,
  cars: [
    {name:"Ford", models:["Fiesta", "Focus", "Mustang"]},
    {name:"BMW", models:["320", "X3", "X5"]},
    {name:"Fiat", models:["500", "Panda"]}
  ]
}

Aby uzyskać dostęp do tablic wewnątrz tablic, użyj pętli for-in dla każdej tablicy:

Przykład

for (let i in myObj.cars) {
  x += "<h1>" + myObj.cars[i].name + "</h1>";
  for (let j in myObj.cars[i].models) {
    x += myObj.cars[i].models[j];
  }
}

Atrybuty nieruchomości

Wszystkie właściwości mają nazwę. Ponadto mają również wartość.

Wartość jest jednym z atrybutów właściwości.

Inne atrybuty to: przeliczalne, konfigurowalne i zapisywalne.

Te atrybuty określają, w jaki sposób można uzyskać dostęp do właściwości (czy można ją odczytać?, czy można ją zapisać?)

W JavaScript można odczytać wszystkie atrybuty, ale tylko atrybut wartości może zostać zmieniony (i tylko wtedy, gdy właściwość jest zapisywalna).

( ECMAScript 5 ma metody zarówno do pobierania, jak i ustawiania wszystkich atrybutów właściwości)


Właściwości prototypu

Obiekty JavaScript dziedziczą właściwości swojego prototypu.

Słowo deletekluczowe nie usuwa właściwości dziedziczonych, ale jeśli usuniesz właściwość prototypu, wpłynie to na wszystkie obiekty odziedziczone z prototypu.