dir.by  
  Search  
Programming, development, testing
JavaScript - programming language for HTML
JavaScript стандарт ES6. Издан в 2015 году. Поддерживается НЕ всеми браузерами. Синонимы ES6, ES2015, ECMAScript 2015
class | Class in the JavaScript. Example: class Book {...} ... var obj1 = new Book(); | стандарт ES6
  Looked at 7356 times    
 class | Class in the JavaScript | стандарт ES6 
last updated: 1 Augusta 2020
With the advent of the standard ES2015 (ES6) in the JavaScript type appeared class.

A class can contain:
• constructors for the class
• Variables
• Functions
• static functions
Class definition (declaration)
A class is defined by a word class
Example
  Html  
<script>
     class MyBook
     {
          // constructor at the class
          constructor(name)
          {
               // this.variable name = ...
               // this is to create a variable for the class

               // create variables for the class
               this.Name = name; // the variable contains text
               this.Author = "";   // the variable contains text
               this.Price = 0;      // the variable contains a number
               this.Valuta = '';    // the variable contains text

               // create a variable for the class
               this.MyInfo = // the variable contains a set of properties
               {
                    // property set
                    PagesCount: 90,
                    HasPictures: true
               };
          }

          // function at the class
          ShowMyMessage(title)
          {
               alert(title + " " + this.Name + " " + this.MyInfo.PagesCount);
          }
     }

     // create a class object
     var obj1 = new MyBook("Mathematics");

     // call the function at the class
     obj1.ShowMyMessage("My Book");
     // On the screen we will see "My Book Mathematics 90"
</script>
Variables in the classroom
Note! Variables for a class can be created in more than just the class constructor.
Variables for a class can be created in any function of the class.

To create a variable for a class, you need to write:
this.variable name = ...
it needs to be written inside the function
  Html  
<script>
     class MyBook
     {
          // function at the class
          Calculate()
          {
               this.Price = 100;
          }
     }

     // create a class object
     var obj1 = new MyBook;

     // call the function at the class
     obj1.Calculate();

     // display the variable at the class
     alert(obj1.Price);
     // On the screen we will see 100
</script>
Static functions in a class
Word static defines a static function for a class.
A static function can be called without creating a class object.
  Html  
<script>
     class MyBook
     {
          // function at the class
          static Show()
          {
               alert("Hello!");
          }
     }

     // call a static function on a class
     MyBook.Show();
     // On the screen we will see Hello!
</script>
Class Definition
Error! If you first create a class object, and then there is a definition of the class.
  Html  
<script>
     // create a class object
     var obj1 = new MyBook("Mathematics"); // Error! Uncaught ReferenceError: MyBook is not defined

     // class definition
     class MyBook
     {
          // class constructor
          constructor(name)
          {
               this.Name = name;
          }
     }
</script>
A class can be unnamed
  Html     Example 1 (unnamed class)
<script>
     // define an unnamed class
     var myClass1 = class
     {
          // constructor at the class
          constructor(name)
          {
               this.Name = name;
          }

          // function at the class
          ShowMyMessage()
          {
               alert(this.Name);
          }
     };

     // create a class object
     var obj1 = new myClass1("Fantastic");

     // call the function at the class
     obj1.ShowMyMessage();
     // On the screen we will see "Fantastic"
</script>
  Html     Example 2 (unnamed class)
<script>
     // create an unnamed class object
     var obj1 = new class
     {
          // constructor at the class
          constructor(name)
          {
               this.Name = name;
          }

          // function at the class
          ShowMyMessage()
          {
               alert(this.Name);
          }
     }("Fantastic");

     // call the function at the class
     obj1.ShowMyMessage();
     // On the screen we will see "Fantastic"
</script>
Class inheritance
To inherit a class in the JavaScript you need to use the word extends
  Html  
<script>
     // class definition
     class Cat
     {
          // constructor at the class
          constructor()
          {
          }

          // function at the class
          Say()
          {
               alert("Meow");
          }
     }
    
     // class Tiger inherited from class Cat
     class Tiger extends Cat
     {
          // constructor at the class
          constructor()
          {
               // call the constructor at the base class
               super();
          }

          // function at the class
          Say()
          {
               // call the function at the base class
               super.Say();

               alert("Snarl");
          }
     }

     // create a class object
     var obj1 = new Tiger();
     obj1.Say();
     // On the screen we will see "Meow" "Snarl"
</script>
Note!
Word super must be used to call the base method or constructor.

Importantly!
If you defined a constructor in an inherited class, you must call the base class constructor.
  Html     Example (no errors)
class Tiger extends Cat
{
     // constructor at the class
     constructor()
     {
          // call the constructor at the base class
          super();
     }
}
If you do not call the base class constructor, there will be an error.
  Html     Error
class Tiger extends Cat
{
     // constructor at the class
     constructor()
     {
          // Error! The base class constructor was not invoked
          // Uncaught ReferenceError: Must call super constructor in derived class before accessing 'this' or returning from derived constructor
     }
}
 
← Previous topic
In a text variable, you can write expressions with variables (formatting, string interpolation). Example: var myText = `Hello ${a}` | JavaScript standard ES6
 
Next topic →
promise in the JavaScript | standard ES6
 
Your feedback ... Comments ...
   
Your Name
Your comment (www links can only be added by a logged-in user)

  Объявления  
  Объявления  
 
In which editor (program) is it convenient to write JavaScript code?
New app
Create a new application JavaScript in a text editor
Create a new application JavaScript in Visual Studio Code. Debug the application. See in debugging how to perform JavaScript
Debugging JavaScript, HTML
Debug JavaScript in Google Chrome. Using debugger
How to find out (see) where the error is when executing HTML, JavaScript in Google Chrome
Debugging JavaScript in the Google Chrome. Use console.log("Hello!")
JavaScript стандарт ES5. Издан в 2009 году. Поддерживается всеми браузерами
Function
Function in the JavaScript. Example: function CalculateSum(value1, value2) { ... } | standard ES5
Function return || in the JavaScript. Example: function getPersonName(name) { return name || "Evgen" } | standard ES5
Call a function before it is defined (Hoisting) in the JavaScript | standard ES5
Variables within a function (lifetime of variables within a function) JavaScript | standard ES5
Pass parameters by value and by reference to the function in the JavaScript | standard ES5
How to find out... whether there is a function by name in the JavaScript? Example: typeof calcSum == "function" | standard ES5
The function described inside the function. JavaScript | standard ES5
Unnamed function
Unnamed function in the JavaScript . Using an unnamed function: create a new variable and assign an unnamed function to a new variable. Example: var myFunc1 = function (a, b) { return a + b; } ; | standard ES5
Unnamed function in the JavaScript . Using an unnamed function: pass an unnamed function as a parameter to another function. Example: Calculate(15, 7, function(v1, v2) {return v1+v2;}); | standard ES5
Само-вызывающая безымянная функция
Self-calling unnamed function in the JavaScript. Where is it used? Used in Yandex advertising. Example: ( function(){ ... } )(); | standard ES5
Create a file js with an object containing export variables and functions. This is an example of using a self-calling unnamed function | standard ES5
Lambda function (abbreviated version of the unnamed function)
Lambda function in the JavaScript . Use the lambda function. [Example1] var myFunc1 = (a, b) => a + b; [Example2] Calculate(15, 7, (v1, v2) => {return v1+v2;}); | standard ES5
Variables
Variables in the JavaScript (text, number, flag, date and time) | standard ES5
Accessing Variables Before Defining Them (Hoisting) in the JavaScript | standard ES5
Variable scope var, let, const in the JavaScript | standard ES5
Text, strings in the JavaScript
Text in the JavaScript. Class String. Example: var myText = String("World"); | standard ES5
Length (string length in the JavaScript) | standard ES5
Function replace(text1, text2) replace text in the JavaScript | standard ES5
Function toUpperCase() converts text to uppercase JavaScript | standard ES5
Function toLowerCase() lowercase text JavaScript | standard ES5
Function split(delimiter) splits a string into substrings JavaScript | standard ES5
Function charAt(position) get a symbol by position JavaScript | standard ES5
Function substr(pos, len) returns a substring JavaScript | standard ES5
Function slice(pos1, pos2) returns a substring JavaScript | standard ES5
Function substring(pos1, pos2) returns a substring JavaScript | standard ES5
Function indexOf(text, startPos) searches for a substring and returns an index JavaScript | standard ES5
Function startsWith(text) Checks, whether the line begins with the specified substring JavaScript | standard ES5
Function trim() remove spaces at the beginning and end of a line JavaScript | standard ES5
Функция padStart(length, symbol) добавляет в начале строки символы до нужной длины строки JavaScript | стандарт ES5
Функция padEnd(length, symbol) добавляет в конце строки символы до нужной длины строки JavaScript | стандарт ES5
В текстовую переменную можно назначить текст как много строк. Пример: var myText = `Hello \n Thanks \n Bye` | JavaScript standard ES6
In a text variable, you can write expressions with variables (formatting, string interpolation). Example: var myText = `Hello ${a}` | JavaScript standard ES6
Регулярные выражения
Регулярные выражения в JavaScript | standard ES5
Write a regular expression to remove all special characters except letters and numbers | Regex JavaScript | standard ES5
Numbers and mathematical functions
Number in the JavaScript. Convert text to a number. Rounding a number. Convert hexadecimal to decimal. | standard ES5
Mathematical functions from the library Math: Sin, cos, log, pow and so on in the JavaScript | standard ES5
Date & Time
Date & Time (year, month, date, hours, minutes, seconds) in the JavaScript. Class Date | standard ES5
Array
Array in the JavaScript This is [] or class Array | standard ES5
Что значит 3 точки ...items | Пример 1: Math.max(...prices) | Пример 2: books.push(...items) | JavaScript, стандарт ES5
Difference between push(items) and push(...items) | Adding an Array to an Array in the JavaScript | standard ES5
Найти max цены в сложном массиве: [ {name:"Tomate", price:10}, {name:"Apple", price:17}, {name:"Orange", price:15} ] в JavaScript | стандарт ES5
Найти min цены в сложном массиве: [ {name:"Tomate", price:10}, {name:"Apple", price:17}, {name:"Orange", price:15} ] в JavaScript | стандарт ES5
Collection Map and Set
Collection "The key-meaning" in the JavaScript. Class Map | standard ES5
Collection of unique values in the JavaScript. Class Set | standard ES5
Object {set of properties and functions}
{} it's an object in the JavaScript. An object contains a set of properties and functions. Example var book = {Name: "Wizard of the Mediterranean", Price: 120}; | standard ES5
{...} = объект в JavaScript заполняем из переменных класса или другим объектом. Пример: const {name, total, price} = b.myProps; | standard ES5
Class (it is a function using new) | стандарт ES5
Class in the JavaScript this is a common constructor function. Such a constructor function contains simple data, objects, internal functions in the JavaScript. To create a class object, use new Example: function Book() { ... } ... var obj1 = new Book(); | стандарт ES5
Encapsulating variables (hiding variables for access) in the function (as a class) in the JavaScript | standard ES5
prototype - is a set of functions, variables for all instances of the class (as a function) in the JavaScript | standard ES5
try catch
Why you need to use try and catch in the JavaScript? | standard ES5
Closing (closure) in the Javascript
What are closures? (closure) in the JavaScript ? Standard ES5
Управление памятью в JavaScript
Управление памятью в JavaScript | standard ES5
Examples of picture movement and animation
Анимация человечка на месте. Используем HTML элемент <div>. Для анимации используем CSS стили: "animation", "background-image", "background-position", "keyframes" | standard ES5
Анимация человечка в движении (sprite). Используем HTML элементы <div>, <img>. Для анимации используем CSS стили: "animation", "background-image", "background-position", "keyframes" | standard ES5
Рисуем картинку с движением. Используем HTML элемент <canvas>. Для движения используем JavaScript: var img = new Image(), img.src = url, drawImage, timer, window.setInterval | standard ES5
Drawing a picture with movement and animation (sprite). Используем HTML элемент <canvas>. Для движения используем JavaScript: var img = new Image(), img.src = url, drawImage, timer, window.setInterval | standard ES5
Examples
Как определить устройство (планшет, компьютер, телефон) сейчас используется в JavaScript, HTML | standard ES5
Text Editor write in HTML, JavaScript | standard ES5
Do Popup using HTML and Javascript
How to make a Popup window in a HTML page | Javascript, HTML, CSS
Моя игра (HTML, JavaScript)
Моя игра "Wizard World" | HTML, JavaScript
PDF readers. Загрузка и отображение файла PDF (JavaScript, HTML)
PDF reader. Загрузка и отображение файла PDF (adobe JavaScript, HTML) | PDF JavaScript implemented by Adobe
PDF reader. Download and display a file PDF (JavaScript, HTML) | PDF JavaScript implemented by Mozilla
JavaScript стандарт ES6. Издан в 2015 году. Поддерживается НЕ всеми браузерами. Синонимы ES6, ES2015, ECMAScript 2015
In a text variable, you can write expressions with variables (formatting, string interpolation). Example: var myText = `Hello ${a}` | JavaScript standard ES6
class | Class in the JavaScript. Example: class Book {...} ... var obj1 = new Book(); | стандарт ES6
promise in the JavaScript | standard ES6

  Ваши вопросы присылайте по почте: info@dir.by  
Яндекс.Метрика