JavaScript Functions (7)

Use functions as attributes

Any type of object can be used as an attribute. Recall the previous example 4 (not example dt4), and the function is also an object. Therefore, you can use a function as an attribute of an object. Next, I will add two functions: getsalary and addsalary.

Example dt7

Code:

Function employee (name, salary)
{
This. Name = Name;
This. Salary = salary;

This. addsalary = addsalaryfunction;

This. getsalary = function ()
{
Return this. salary;
};
}
Function addsalaryfunction (addition)
{
This. Salary = This. Salary + addition;
}

VaR boss = new employee ("John", 200000 );
Boss. addsalary (10000); // The boss has a salary of 10 k ...... Why can the boss pay so much :'(
Alert (boss. getsalary (); // output 210 K ...... Why is the default salary so high ...... :'(

Addsalary and getsalary demonstrate several different methods for assigning functions to attributes. If you remember what we discussed at the beginning, I discussed the different methods for declaring the three functions. All those are applicable here, but the two shown above are the most commonly used.

Let's see what's different. Next, pay attention to the 9-12 lines of code. When this part of the code is executed, the getsalary function is declared. As mentioned previously, the result of a function declaration is that an object is created. So at this time, the boss is created (the next 19th rows), and the boss has a getsalary attribute.

Code:

Function employee (name, salary)
{
This. Name = Name;
This. Salary = salary;

This. addsalary = addsalaryfunction;

This. getsalary = function ()
{
Return this. salary;
};
}
Function addsalaryfunction (addition)
{
This. Salary = This. Salary + addition;
}

VaR boss = new employee ("John", 200000 );
VaR boss2 = new employee ("Joan", 200000 );
VaR boss3 = new employee ("Kim", 200000 );

When you create more instances of this object (boss2 and boss3), each instance has a separate copy of The getsalary code. In contrast, addsalary points to the same place (that is, addsalaryfunction ).

Take a look at the following code to understand the content described above.

Example dt8

Code:

Function employee (name, salary)
{
This. Name = Name;
This. Salary = salary;

This. addsalary = addsalaryfunction;
This. getsalary = function ()
{
Return this. salary;
};
}
Function addsalaryfunction (addition)
{
This. Salary = This. Salary + addition;
}

VaR boss1 = new employee ("John", 200000 );
VaR boss2 = new employee ("Joan", 200000 );

// Add attributes to the getsalary function object
Boss1.getsalary. Owner = "boss1 ";
Boss2.getsalary. Owner = "boss2 ";
Alert (boss1.getsalary. Owner); // output "boss1"
Alert (boss2.getsalary. Owner); // output "boss2"
// If two objects direct to the same function object
// Both outputs must be "boss2 ".

// Add attributes to the addsalary function object
Boss1.addsalary. Owner = "boss1 ";
Boss1.addsalary. Owner = "boss2 ";
Alert (boss1.addsalary. Owner); // output "boss2"
Alert (boss2.addsalary. Owner); // output "boss2"
// Because both objects point to the same function (sub-Note: In the original text, are not pointing to the same function, which is a false positive)
// When one of them is modified, all instances are affected (so both instances output "boss2 ").

It may not be important, but here are some conclusions about running nested functions similar to the above getsalary: 1) more storage space is required to store objects (because each object instance has its own getsalary code copy). 2) JavaScript needs more time to construct this object.

Let's rewrite this example to make it more efficient.

Example dt9

Code:

Function employee (name, salary)
{
This. Name = Name;
This. Salary = salary;

This. addsalary = addsalaryfunction;
This. getsalary = getsalaryfunction;
}
Function getsalaryfunction ()
{
Return this. salary;
}

Function addsalaryfunction (addition)
{
This. Salary = This. Salary + addition;
}

Here, both functions point to the same place, which saves space and shortens the construction time (especially when you have a lot of built-in functions in one constructor ). Another function can be used to improve the design. It is called prototype, and we will discuss it in the next section.