Javascript object-oriented (1)

Source: Internet
Author: User
Generalized concept: All returned code blocks can be expressions. For example, the concept of 1 expression.

Broadly speaking, all returned code blocks can be expressions. For example:

Var a = 0; var a, B; a = 0; return value of this expression is 0; B = a; return value of this expression is;

The Return Value of the value assignment expression is = the value on the right;


2. object-oriented concepts:

A programming idea. Core: When solving any problem, we first try to find an object to help solve the problem.

Advantages:

Identity: scheduler;

High code flexibility;

High maintainability;

High scalability;


Disadvantages:

This may increase the complexity of the Code.

Poor readability


3 process-oriented:

Identity: performer

Sequence: Generally, it cannot be disrupted. It can be executed from top to next.


4. Features of The Javascript language:

Weak type

Multi-paradigm

Object-based language: In js, everything is an object

Prototype-based language


5 Concept of Prototype

The prototype is the object referenced by the prototype attribute of a function.

As long as a function is declared, the prototype exists.

function foo(){};foo.prototype['name']='ksir';var f = new foo();console.log(f.constructor ===foo.prototype.constructor);

Every object created through this function shares this prototype. That is to say, all the objects created above can directly access any member (attributes and methods) of the prototype );
(The dynamic feature of an object is that the object can be dynamically created through the same. or );


6. Nature of Prototype

Prototype is essentially an object

Function Person (name, age, gender) {this. name = name; this. age = age; this. gender = gender; this. talk = function () {console. log ('hello') ;}} var kangfeng = new Person ('xiaoqiao', 21, 'male'); var xiaoming = new Person ('xiaoming ', 20, 'Female '); var xiaohong = new Person ('little red', '19', 'female'); kangfeng. talk (); xiaoming. talk (); xiaohong. talk (); // think: are the three women's talk methods the same? Console. log (xiaoming. talk === kangfeng. talk); console. log (xiaohong. talk === xiaohong. talk): // The methods of these three objects are different, and they are independent of each other. prototype. addfu () {console. log ('Add a function to the prototype ');}

The same logic code exists in the constructor. when an object is created, the Code logic in the constructor is copied, and the methods in the constructor are extracted and put in a public place, this common place is that all the objects created by the constructor can be accessed.-All the objects of the constructor can share the prototype of the constructor.

Advantage: data sharing for similar objects

7. Obtain the prototype

Function:

 
  .prototype;
 

Passing object:

Object. _ proto __; // two underlines

8. Object Components

Object itself; its prototype

Each object has the _ proto _ attribute, that is, each object has the original type.

Math.__proto__===object.prototype;

The object type is the name of the constructor.


9. Prototype attributes and prototype objects

Prototype attribute: from the perspective of a function, the prototype attribute can be called the prototype attribute of the function.

Prototype object: from the object perspective, a prototype object can be called a prototype object of this object.


10 _ proto _ Double underline Standard


The _ proto _ Double underline standard is not w3c standard, and these attributes are non-standard attributes.

Compatibility issues. If we cannot obtain the prototype attribute through double underscores, we need to obtain it through the function.

Function getPrototype (obj) {// determine whether the browser is compatible with the _ proto _ attribute // return !! Obj. _ proto __? Obj. _ proto __: obj. constructor. prototype; if (obj. _ proto _) {// return obj is supported. _ proto __;} else {// get the constructor of this object // obtain the prototype object return obj through the prototype attribute of this function. constructor. prototype ;}} function A () {}; var a = A (); console. log (getPrototype (). constructor); // if our function has the if else return structure, we can use the 3-element operator to optimize it.


11 standard constructor Writing Method // which attributes should be stored in the constructor and which attributes need to be extracted and put on the prototype

Function B (name) {}; B. prototype. name = 'Tom '; var tom = new B; console. log (tom. name); var jim = new jim; console. log (jim. name); // The result is tom // so private attributes that are closely related to a specific object must be written in the constructor, shared attributes (attributes of each object do not change with the object. For example, some methods (object behavior)-Public attributes can be defined in the prototype attributes. // In general, the constructor method is placed on the prototype. // It is not recommended to expand the member on the js native object. // The disadvantage will cause the native object to be too large and cumbersome, affecting the performance.

12. Notes


Adding Methods to constructors is generally added to the prototype. For convenience, methods are generally added as objects <构造函数名> In. prototype {}, do not forget to add constructor: constructor name key-Value Pair form.


13 features of the prototype

Dynamic:

The extended prototype members are directly directed to the created objects.

Replacing the prototype object does not reflect the created object, but directly affects the created object.

Uniqueness

All objects created by the same function share the same prototype object.

Immutable:

The object cannot change any member of the prototype object.

Inheritance:

All objects inherit from their prototype objects.

The above is the content of Javascript object-oriented Article (1). For more information, see PHP Chinese website (www.php1.cn )!

Related Article

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.