JS Face Object Programming (ii): Properties and closures __ Applet

Source: Internet
Author: User
Tags closure

On the blog to explain some of the basic concepts and usage of JS, this blog to explain the properties of JS: Public properties, private properties, privileged methods.


If you have studied Java, public properties, private properties, and privileged methods (that is, methods that can access and set private properties) must be familiar, so let's look at how to implement it in JS.


1. Public Property

First of all, the first level of public opinion is accessible to all, and the opening up of the property is relative to the private property:

function Person (name,age) {
	this.name=name;
	This.age=age;
	This.getname=function () {return
		this.name;
	}
	This.getage=function () {return
		this.age;
	}
}
var josh=new person (' Josh ', ') '
console.log (josh.name);  Josh
Console.log (Josh.getname ());//josh

We've defined here a person named Josh, and let's Create 2 other man objects with the new method

var eric=new person (' Eric ', ') ';
var mongo=new person (' MONGO ', ') ';
Console.log (eric.name);  Eric
Console.log (mongo.name);  Monge
Every time we create an object here, all the code in the person is duplicated, creating a waste of memory, which can be solved by defining methods common to the same class of objects, so we need prototype keyword here.

Literally, prototype can be understood as "property to type", which is a type of attribute, for a class of attributes, with the person defined above, that is, the method or property common to the class of person, we change the above code

function Person (name,age) {
	this.name=name;
	this.age=age;

}
Person.prototype.getname=function () {return
	this.name;
}
Person.prototype.getage=function () {return
	this.age;
}
	
var josh=new person (' josh ', ' = ')
var eric=new person (' Eric ', ') ';
var mongo=new person (' MONGO ', ') ';
Console.log (Josh.getname ()); Josh
Console.log (eric.name);  Eric
Console.log (mongo.name);  Monge

So a public method or attribute can also be understood as a method or property added by the prototype of a constructor, where the constructor is the person, and since the concept of the class is not present in JS, we create a new object through the constructor, and the property method defined by prototype, Shared for this class, like a static method or attribute in a class in Java is shared by a category.


2. Private Properties

Based on the encapsulation characteristics of the object, we do not want to expose all variables to the outside world, so take the person object above, we change the this.name in the attribute definition to Var name, so the public property that can be accessed by the outside becomes a private property. Access to attributes is also turned into a undefined

The function person (name,age) {
	//this.name was replaced with the Var name
	var name=name;
	var age=age;
}

var josh=new person (' josh ', ' = ')
var eric=new person (' Eric ', ') ';
var mongo=new person (' MONGO ', ') ';
Console.log (Josh.name); Undefined
console.log (eric.name);  Undefined
console.log (mongo.name);  Undefined

Why THIS.name was replaced with the Var name, and the object attribute is owned by the public. First look at the This keyword, this represents the object that exists for the current property:
function Person (name,age) {
	this.name=name;
	This.age=age;
}
The above code is replaced by the following paragraph, and you can see that you first define a person empty constructor, define the person object, and then increase the name and age attribute based on the attribute's dynamic increment or decrease attribute

function person () {
}
var person=new person ();
Person.name= ' Josh ';
Person.age= ' 25 ';

How do you implement the private property of Var name? Here is to design JS face the object of several important basic concepts, respectively, is the scope, context, closure.

First of all, if you have any contact with a programming language, you should know that the scope is the current defined variable can be referenced in what range. To take the more familiar Java, Java is block-level, in the case, while these blocks are defined, can only be used in the block, out of the block, if you want to a larger scope, you can define the method at the beginning, but not in the method is used, but can also define class-level, Can be referenced throughout the class.

In JS, the scope is function-level, that is, the variables defined within the function, not referenced outside the function, function has played a role in defining the scope. In the example above, access to the Josh.name attribute becomes undefined.

The function person (name,age) {
	//this.name was replaced with the Var name
	var name=name;
	var age=age;
}
var josh=new person (' Josh ', ') ';
Console.log (Josh.name); Undefined

Then the context is explained, and the context indicates the environment in which the function or object is located, which contains variables, objects, or functions. Look at a picture together with the concept of scope



In this picture, a person object can access a variable in the context, an object, or a function, while a variable in the context cannot access the Name property of the person object because the scope of the Name property is confined to the person object, that is, the outer layer is open to the inside, and the inner layer closes externally.

Then it derives the concept of closure, closure is a closed package, can reject the outer access, the figure of person object is a closure, the package can not access the private variables in the package, only through some special way (privileged method) to access. The next privileged method is described below. 3. Privileged Methods

Privileged methods are equivalent to Get/set methods that provide access and settings to private variables in Java classes

The function person () {
	//is underlined before the private property, representing the private property
	var _name;
	var _age;
	This.getname=function () {return
		_name;
	}
	This.getage=function () {return
		_age;
	}
	This.setname=function (name) {
		_name=name
	}
	This.setage=function (age) {
		_age=age;
	}
}

var josh=new person ();
Josh.setname (' Josh ');
Josh.setage (' a ');
Console.log (Josh.getname ()); 
Console.log (Josh.getage ());

To this, the common attribute, the private property, the closure concept is finished, this blog has a very small space for the concept of closure, but it illustrates the most fundamental nature of closures, the function of the context does not have the right to access the variables defined within the function, so that the formation of a closure (a closed package). We have this concept, and then look at the closure of the article, will be very useful.









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.