JavaScript Object learning notes

Source: Internet
Author: User
An object is a basic unit of JavaScript. In JavaScript, everything is actually an object, and

An object is a basic unit of JavaScript. In JavaScript, everything is actually an object and has powerful functions. It not only has a unique style, but also has unique functions.

I. reference)

The reference concept is one of the basics of JS. It is a pointer to the actual location of the object. See the following example:

Var items = new Array ("abc", "def", "hig"); // create reference var Ref = items; items for this Array. push ("klm"); alert (Ref. lenth); // 4 is displayed here

However, if it is a string, different situations may occur. See the following code:

Var items = "abc"; var Ref = items; items + = "def"; // a new object is created here, instead of modifying the original object.

Now, Ref and items point to different objects.

Ii. Function Overloading

Each function in JS has an argument variable, which is a pseudo array that receives all parameters. Why is it "pseudo", because you cannot modify it, but it has the length attribute. Let's take a look at the following example:

Function myFun (num1, num2) {if (arguments. length = 2) {alert ("I have two parameters");} if (arguments. length = 1) {alert ("I have a parameter ");}}

Next, we call the function myFun ("abc"); myFun ("abc", "def"); to see what is different, the most important thing is that this is actually a function overload :)

Iii. Scope

In JavaScript, the scope is divided by functions, rather than blocks (while, if,. This may cause some trouble when understanding some code. To illustrate the details, let's look at the following example:

Var temp = "oldTemp" // The global variable if (true) {var temp = "newTemp" // It is still global} alert (temp = "newTemp ") // finds equal

However, if we declare and change the temp variable in a function, the effect is completely different. See the example below:

Var temp = "oldTemp"; // global variable function test () {var temp = "newTemp";} test (); alert (temp = "newTemp "); // unequal

In JS, the global variable is an attribute of the window object. In the preceding example, the global variable temp = window. temp, it should be noted that if a variable lacks declaration, it will automatically become a global variable, although it is likely to be used only in a function.

Iv. Closure

Closure means that the inner function can reference the variables in the function that enclose it, even if the outer function has been terminated. See the following example:

Function AddNum (num1) {return function (num2) {return num1 + num2 ;}} var temp = AddNum (4); // input the first parameter, then AddNum disappears var temp2 = temp (5); // input the second parameter, then add it, and return 9 alert (temp2 );

This example demonstrates the concept of closure, which is a special case, of course, not used in ordinary times.

5. Context object

The context object is embodied through the this variable, which always points to the object where the current code is located. See the following code:

Var obj = {yes: function () {this. val = true ;}, no: function () {this. val = false ;}} alert (obj. val = null); // here we find that the object obj does not have the val attribute obj. yes (); // execute the yes function. obj has the val attribute alert (obj. val = true); window. no = obj. no // pass the no function of obj to the window Object window. no (); alert (obj. val = true); // The alert (window. val = false) // convert val in window to false;

It is not easy to understand here. Fortunately, JS provides the call Method for us. See the following example:

Function changeColor (color) {this. style. color = color;} changeColor ("Red"); // No, because the window object does not have the style attribute var temp = document. getElementById ("temp"); changeColor. call (temp, "White"); // pay attention to the call usage here

The call method sets the context object as the first parameter and uses other parameters as the parameters of the original function.

Vi. Objects

We have entered the topic here, but with the previous concepts, this is actually not a lot of content. Let's look at the example:

Var obj = new Object (); // create an Object objobj. val = 5; // create the property obj and assign it the value obj. click = function () // CREATE function {alert ("I Have Been clicked ");}

The above code is equivalent to the following code:

Var obj = {val: 5, click: function () {alert ("I Have Been clicked ");}}

Unlike other object-oriented languages, JS does not have the Class concept. In other languages, we basically need to instantiate an instance of a specific Class, but JS is different, the practice is that any function can be instantiated as an object. First, create a simple object:

Function User (name) {this. name = name;} var temp = new User ("James"); alert (temp. name );

What if the above Object User is used only as a function?

User ("used as function only"); alert (window. name );

The context of this is a window object.

VII. Object Methods

Public methods are accessible to end users in the context of objects. Here we need to understand prototype attributes. See the following code:

Function User (name, age) {this. name = name; this. age = age;} User. prototype. getName = function () {return this. name}; var user = new User ("James", 25); alert (user. getName ());

We can also dynamically create public methods, as shown in the following code:

Function User (name, age) {this. name = name; this. age = age; this. getName = function () {return this. name };} var user = new User ("James", 25); alert (user. getName ());

The dynamic generation method is not generated when the code is compiled for the first time. This technique is used to increase the overhead of prototype, but is more powerful and flexible.

Address of this article: http://www.nowamagic.net/librarys/veda/detail/1572,welcome.

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.