Two changes to JSON in ES6

  • Abbreviation: With the same name and value, JSON can be abbreviated
let a=12,b=5;
let json = {
 a,
 b
}
console.log(json) // { a:12 , b:5 }
  • Omit function: Functions in json can be abbreviated
Let persen ={name:' this.name ', age:18, showName(){alert(this.name)}} pers. showName()

ES6 vs. traditional object orientation

Traditional Object Orientation: Classes and constructors together, using Prototype when adding methods to objects. Examples of traditional object orientation are as follows:

function Person(name,age){ this.name = name; Enclosing the age = age} Person. Prototype. ShowName = function () {the console. The log (' my name is', this name)} Person. The prototype. ShowAge = Function (){console.log(' year ',this.age,' year ')} var p = new Person(' year ',18) p.howName () p.howage ()

ES6 object-oriented: Separate classes and constructors.

Class: class

Constructor: constructor refers to a function that executes itself after generating an instance.

class Person{ constructor(name,age){ this.name = name; this.age = age; } // Add method to the object showName(){console.log(' My name ',this.name)} showAge(){console.log(' This year ',this.age," this year ")}} var p =new The Person (' qian qian, 18); p.showName(); p.showAge()

Object-oriented inheritance

Inheritance to traditional object orientation:

Using the apply method, a child class inherits all the properties of the parent class.

Using the Prototype method, a subclass inherits its parent’s methods.

Examples of traditional object-oriented inheritance are as follows:

function Person(name,age){ this.name = name; Enclosing the age = age} Person. Prototype. ShowName = function () {the console. The log (' my name is', this name)} Person. The prototype. ShowAge = Function (){console.log(' year ',this.age,' year ')} function Worker(name,age,job){person. apply(this,arguments)// This = job } Worker.prototype = new Person(); Worker.prototype.showJob = function(){console.log(' Work is ',this.job); } var w = new Worker(' ',18,' '); w.showName(); w.showAge(); w.showJob();

ES6 object-oriented inheritance:

Using extends, children inherit from their parents, and super() inherits properties from the parent class.

class Person{ constructor(name,age){ this.name = name; this.age = age; } showName(){console.log(' My name ',this.name)} showAge(){console.log(' This year ',this.age," Age ")}} class Worker extends Person { Constructor (name,age,job){super(name,age) this.job = job} showJob(){console.log(this.job)} var w = new Worker(' Qianqian ',18,' doing chores '); w.showName(); w.showAge(); w.showJob()

About super:

If a subclass has a constructor, it must have a super inside it. Since a subclass does not have its own ‘this’ object, it must inherit the’ this’ object from its parent.

Here, super(name,age) is the constructor that calls the parent class.

Super represents the constructor of Person, but it returns an instance of the Worker subclass.

ES6 object-oriented advantages

ES6 object-oriented compared to traditional object-oriented syntax simplified

ES6 grammar standard, uniform, suitable for large project development, not easy to conflict.

ES6 is the standard syntax provided by the system, and compatibility issues can be ignored.