JS's Object-oriented

Source: Internet
Author: User
Tags object object

The object-oriented of this paper is divided into ES6 and ES6, and the key learning ES6
===============================
First, object-oriented
1. What is Object-oriented
A) What is an object: All things can be abstracted into objects
Time Object
var odate=new Date (); (we often odate of Var is a time object)
Odate.getfullyear (); (The new odate inherits all the methods in date)
Array
var arr=new Array ();
Arr.sort ();
Arr.length;
json{
Name: ' AA ',
Showname:function () {
Alert (1);
}
}
Json.name; (Properties of JSON object)
Json.showname (); (Method of JSON object)
B) Object-oriented is an idea:
We only care how to use it, don't care how it's implemented.
Increased efficiency

2, how to object-oriented
A) to have an object first
objects have characteristics, and all have properties and methods

A property property is a variable, but he has a dependency.
The characteristic variable is free, Independent

    The method is a function, but he has a dependency.

Function-Independent

b) Build the object
1, var arr=[];
Mass-Build objects

  C) Constructor: The function used to make the object, the constructor is also a function, just because of the use of the name, in order to distinguish with ordinary functions, the first letter capitalized is the constructor

  D) This want to learn object-oriented must know who this is pointing to
What does new do?
1. An empty object is created at the beginning of the constructor (and the this point is pointed to an empty object);
2. Return empty objects automatically

e) attribute is different, the method is the same
is the object-oriented core of ES6: Prototypes

f) Object-oriented How to write: Construct prototype blending mode
1, the construction body plus attributes
2, the prototype Body plus method prototype

function Person (name,age) {
Adding Properties and methods
This.name=name;
This.age=age;
}
Person.prototype.showname=function () {
Alert (' I Am the Dance King ' +this.name);
};

g) prototype is also an object
        1. Write object-oriented to extend the system approach

h) Arr.indexof ()

        Exercises:
Time object inside GetDay 0-6 0 Sunday
Getcnday Monday---Sunday

-----------------------------------
Second, Summary:
1. What is an object:
Everything is an object.
2. What is Object-oriented:
Only care how to call, do not care how to achieve
3. How to write a class is a constructor
Attributes are added to the construction body
Method added to the prototype body

function Person (...) {
This. XX=XXX//Plus Properties
}
Person.prototype.xxx=function () {}; Add method
4. How to build an object
New class name ()
eg var barry=new person (); (Barry gets the properties and methods of person)
What the hell is 5.new doing?
1), create an empty object, and point this to the object
2), return this object
6.prototype Prototypes:
1), can write object-oriented
2), the method that can extend the system
  7. The difference between prototypes and prototype chains
Prototype prototype is an object that exists in every object
Prototype chain: Because of the existence of prototype, JS produces a prototype chain
The methods in 8.ECMAScript are all written in prototypes.

    Class is the constructor function in JS
Instance constructors call the end of the returned object

9. Object-oriented--an idea

  10. Object-oriented features:
Encapsulation abstracts the core of Things
Polymorphic a thing can inherit the characteristics of multiple relatives
Inheriting things has some characteristics of the father.
-----------------------------------
11.object
Instanceof detect the blood relationship of an object
Child instanceof Parent Returns true False
The constructor object was created by that constructor.
Child. constructor== Parent Returns True False

Wrapper class (It's inside Java)
The abbreviated data type object is not recognized.
12.this has priority from top to bottom, with a smaller priority level
New Object
Timer window
An event-triggered event object
Object Object
Show () window
13. Inheriting children inherits the functionality of the parent
Give the parent a function, the child default is

Play Inheritance:
Property
In the construction of a child, calls the parent's construct
function child (name,age) {
//parent. Call (This,name,age);
Parent. Apply (this,arguments);     
}
Method
1, Son.prototype=father.prototype;
  Issue: Child changed parent also changed
2, for (var name in Father.prototype) {
Son.prototype[name]=father.prototype[name];
    
Problem: Child does not recognize Grandpa
3, child. Prototype=new parent ();
Problem: Child children do not recognize children
Ultimate Edition: children. prototype.constructor= children;
-----------------------------------------------
three, ES6     
1. Object
Let Name= ' Zhang San ';
Let json={
Name,
ShowName () {
Alert (this.name)
}
}
2. Object-oriented
CLA       SS person{//Class
Constructor (name,age) {//Construction attribute added to construct body
This.name=name;
This.age=age;
}

    ShowName () {
alert (this.name);
}

Showage () {
alert (this.age);
}
}
3. Inheritance
Class Student extends person{
Constructor (Name,age,job) {
Super (Name,age);//super is here to leapfrog. Inherit the attributes of the parent
this.job=job; attributes added by itself
}

Showjob () {
alert (this.job);
}
}

-------------------------------------------------

ES6 constructor lining-level inherited properties of Parent
  Function name. Call (the point of this, parameters ...). in case of multiple parameters, indeterminate quantity
Function name. apply (the point of this, [parameters, Parameters .... ]);

------------------
Object reference
JS in order to save space, take a behavior;
var arr=[1,2,3];
var Arr2=arr;
------------------
For-in Loop through the properties of an object
Used to loop the object. But you can use a for loop without for-in.

for Var i=0;i<10;i++
-------------------

json{

"A": "1",

"B": "2",

"C": "3"

}

For (var. v in JSON) {

Console.log (v);//Print out

}

JS's Object-oriented

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.