Read more about the advanced programming of JavaScript 第6-7 Chapter

Source: Internet
Author: User
Tags uppercase letter

The sixth chapter object-oriented programming

1. Understanding objects: A collection of unordered attributes whose properties can contain basic values, objects, or functions

1) attribute type:

Data properties:4Properties --[[Configurable]]Indicates whether you can passDeleteDelete the attribute to redefine the property, delete the attribute's attributes, or modify the property to the accessor property, which is the default value oftrue;[[Enumerable]]Indicates whether you can passfor-inthe Loop returns the property,E The default value for this property istrue;[[writable]]indicates whether the value of the property can be modified, the default value of which istrue;[[Value]]contains the data value of this property, reads the value of the property from this location, and writes the value of the property to the new value at this location; To modify the property's default attributes, you must use theECMAScript5of theObject.defineproperty ()method, receives three parameters--the object where the property resides, the name of the property, and a Descriptor object。 In the callObject.defineproperty ()method, if you do not specify theConfigurable,Enumerableand thewritablethe default value of the attribute isfalse.

Accessor properties: Does not contain data values, contains a pair ofGetterand theSetterfunction that is called when the accessor property is read.Getterfunction, which is responsible for returning a valid value, which is called when the accessor property is written.Setterfunction and pass in the new value, this function is responsible for deciding how to handle the data;4Properties --[[Configurable]]Indicates whether you can passDeleteDelete the attribute to redefine the property, delete the attribute's attributes, or modify the property to the accessor property, which is the default value oftrue;[[Enumerable]]Indicates whether you can passfor-inthe Loop returns a property with the default value oftrue;[[Get]]The function that is called when the property is read, the default value of which isundefined;[[Set]]The function that is called when the property is written, the default value of this attribute isundefined;to define properties by default, you must use theECMAScript5of theobject.defineproperty5 ()method, receives three parameters--the object where the property resides, the name of the property, and a Descriptor object

2) define multiple properties:ECMAScript5 defines the object.defineproperties () method for defining multiple properties, receiving two parameters-- The properties of the object whose properties you want to add and modify, and the objects whose properties you want to add and modify,ie9+,firefox4+,safari5+, opera12+,Chrome Works

3) Properties of the Read attribute:ECMAScript5 defines the object.getownpropertydescriptor () method used to obtain a descriptor for a given property, Receive two properties--the object where the property resides and the name of the property whose descriptor you want to read

2. Create objects

1) Factory mode: Use functions to encapsulate the details of creating objects with specific interfaces

2) Constructor mode:

object is not explicitly created; The property and method are assigned directly to the this object; no return statement

4 Steps to call the constructor- create a new object, assign the scope of the constructor to the new object ( This point to the new object), execute the code in the constructor (add to the new object), return the new object

The difference between constructors and other functions: constructors should start with an uppercase letter, the non-constructor should start with a lowercase letter, the constructor is called by the new operator, and each method of the constructor is re-created on each instance

3) Prototype mode: Each function has a prototype (prototype) attribute, which is a pointer to an object that contains properties and methods that can be shared by all instances of a particular type.

 isprototypeof ()   method : if   [[PROTOTYPE]]  point to call   isprototypeof ()   true

Object.getprototypeof () method: Returns the value of [[Prototype]] , the browser that supports this method has ie9+, Firefox 3.5+,Safari 5+,Opera 12+ and Chrome;

hasOwnProperty () method: Detects whether a property exists in the instance or is present in the prototype only if the given property exists in the object instance, and returns true;

Hasprototypeproperty () method: Detects whether a property exists in an instance or is present in the prototype only if the given attribute exists in the prototype object ;

In operator: Returns True when an object is able to access a given property , whether the attribute exists in an instance or in a prototype ;

Object.keys () method: Receives an object as a parameter, returns an instance property containing allenumerable,object.getownpropertynames () method: Gets all instance properties, Regardless of whether it is enumerable, browsers that support both methods are ie9+,Firefox 4+,Safari 5+, opera12+ and Chrome.

Each time the code reads a property of an object, the search is performed once, and the target is a property with the given name. The search begins first from the object instance itself. If a property with the given name is found in the instance, the value of the property is returned, and if it is not found, the prototype object that the pointer points to is searched, and the property with the given name is looked up in the prototype object. If this property is found in the prototype object, the value of the property is returned;

4) combine the constructor pattern with the prototype pattern: the constructor pattern is used to define the instance properties, and the prototype schema is used to define the methods and shared properties.

5) Dynamic Prototyping mode: Encapsulates all information in a constructor, while preserving the advantages of using constructors and prototypes while initializing the prototype in the constructor (only if necessary).

6) Parasitic constructor mode: Creates a function that simply encapsulates the code that creates the object, then returns the newly created object, the object returned is not related to the constructor or the stereotype property of the constructor, and the object returned by the constructor is no different from the object created outside the constructor. You cannot rely on the instanceof operator to determine the object type.

7) Secure constructor mode: The secure constructor follows a pattern similar to the parasitic constructor, but two points are different: one is that the instance method of the newly created object does not refer to this, and the second is not to call the constructor with the new operator.

3. Inheritance:ECMAScript only supports implementation of inheritance

1) prototype chain: The code that adds a method to the prototype must be placed after the statement that replaced the prototype, and the object literal cannot be used to create the prototype method when inheriting through the prototype chain; When you implement inheritance through a prototype, the prototype will actually become an instance of another type, and when you create an instance of the subtype, You cannot pass parameters to a super-type constructor.

2) Borrow a constructor: Call the superclass constructor inside the subtype constructor, or you can execute the constructor on the newly created object by using the apply () and called () methods, and you cannot implement the function reuse.

3) Combinatorial inheritance: Use the prototype chain to implement the inheritance of the prototype properties and methods, and by borrowing the constructor to implement the inheritance of the instance properties.

4) Prototype inheritance: With prototypes, you can create new objects based on existing objects without having to create custom types.

function Object (o) {

function F () {}

F.prototype = O;

return new F ();

}

5) Parasitic inheritance: Create a function that encapsulates the inheritance process, which internally enhances the object in some way, and then returns the object.

function Createanother (original) {

var Clone = Object (original); Create a new object by calling a function

Clone.sayhi = function () {// to enhance this object in some way

Alert ("HI");

};

return clone; return This object

}

6) Parasitic combined inheritance: Use parasitic inheritance to inherit a super-type prototype, and then assign the result to a prototype of the subtype.

function Inheritprototype (subtype, supertype) {

var prototype = object (Supertype.prototype); Creating Objects

Prototype.constructor = subtype; Enhanced Objects

Subtype.prototype = prototype; Specifying Objects

}

Seventh Chapter function Expression

Function declaration: Functionfunctionname (ARG0,ARG1,ARG2) {// function Body }, which is read before executing code

function expression:var functionname=function (arg0,arg1,arg2) {// function Body }, the function created in this case is called an anonymous function (lambda function)

1. Recursion:

Arguments.callee is a pointer to a function that is executing, so you can use it to implement a recursive call to a function

function factorial (num) {

F (Num <= 1) {

RETURN1;

}else{

Return Num*arguments.callee (num-1);

}

}

In strict mode, Arguments.callee cannot be accessed through scripting

var factorial= (function f (num) {

F (Num <= 1) {

RETURN1;

}else{

Return num*f (num-1);

}

});

2. Closure: A function that has access to a variable in another function scope; a common way to create closures is to create another function inside one function

1) Closures and variables: Closures can only get the last value of any variable in the containing function. Here's how to fix it:

function Createfunctions () {

var result = new Array ();

for (var i=0; i <; i++) {

Result[i] = function (num) {

return function () {

return num;

};

} (i);

}

return result;

}

3, simulation block-level scope:

Anonymous functions for block-level scope (private scope):

(function () {

This is a block level scope .

})();

4. Private variables: Include function parameters, local variables and other functions defined inside the function; Privileged methods: public methods that have access to private variables and private functions;

Define the privileged method in the constructor:

function MyObject () {

private variables and private functions

var privatevariable=10;

Function privatefunction () {

return false;

}

Privileged Methods

This.publicmethod=function () {

privatevariable++;

return Privatefunction ();

};

}

Static private variables: By defining private variables or functions and privileged methods for a custom type in a private scope, the primary difference between this pattern and the privileged method defined in the constructor is that private variables and functions are shared by the instance. The basic pattern is as follows:

(function () {

private variables and private functions

var privatevariable=10;

function Privatefunction () {

return false;

}

constructor Function

Myobject=function () {

};

public / Privileged Methods

Myobject.prototype.publicmethod=function () {

privatevariable++;

return Privatefunction ();

};

})();

Module mode: Create private variables and privileged methods for singleton; Singleton: Refers to an object with only one instance, andJavaScript creates a singleton object in the form of an object literal. The basic pattern is as follows:

var singleton=function () {

private variables and private functions

var privatevariable=10;

function Privatefunction () {

return false;

}

Privileged / public methods and properties

return{

Publicproperty:true;

Publicmethod:function () {

privatevariable++;

return Privatefunction ();

}

};

}();

Enhanced Module mode

var singleton=function () {

private variables and private functions

var privatevariable=10;

function Privatefunction () {

return false;

}

Creating Objects

var object=new customtype ();

Add Privilege / public methods and properties

Object.publicproperty=true;

Publicmethod=function () {

privatevariable++;

return Privatefunction ();

};

return This object

return object;

}();

Read more about the advanced programming of JavaScript 第6-7 Chapter

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.