Home > Web Front-end > JS Tutorial > JavaScript object-oriented feature code examples_javascript skills

JavaScript object-oriented feature code examples_javascript skills

WBOY
Release: 2016-05-16 16:44:52
Original
972 people have browsed it

1. Use of basic classes
Method 1:

Copy code The code is as follows :

function sth(a) // Constructor
{
this.a = a;
this.fun = output; // Member function
}

function output(a, b, c)
{
document.write(this.a);
}

//Call
var s = new sth(250);
s.fun(1, 2, 3);
ouput(1, 2, 3); //If output is in sth It was wrong before

Method 2:

Copy code The code is as follows:
function sth(a)
{
this.a = a;
this.output = function()
{
document.write(this.a);
}
}

var s = new sth(2);
s.output(); // Output 2

2. Inheritance
Method 1:
Copy code The code is as follows:
function A(x)
{
this.x = x;
}

function B(x, y)
{
// Method 1
/*
this.construct = A;
this.construct(x);
delete this .construct;
*/

// Method 2
//A.call(this, x);

// Method 3
A.apply(this , new Array(x)); // You can also A.apply(this, arguments), but the order of arguments must be correct

this.y = y;
this.print = function()
{
document.write("x = ", x,
", y = ", y);
}
}

var b = new B(1, 2);
b.print();
alert(B instanceof A); // Output false

Advantages: Multiple inheritance can be achieved (just make multiple calls)

Disadvantages:
· Must be used as a constructor
· Using the instanceof operator to operate this type of inheritance results in false

Method 2:

Copy code The code is as follows:
function A()
{

}
A.prototype.x = 1;

function B()
{

}
B.prototype = new A(); // Cannot take parameters!
B.prototype.y = 2;
B.prototype.print = function()
{
document.write(this.x, ", ", this.y, "}

var b = new B();
b.print();
document.write(b instanceof A); // Output true


Disadvantages:
· Cannot implement multiple inheritance
· The constructor does not take parameters

Tips

Usually use mixed mode, both together

Copy code The code is as follows:

function A(x)
{
this.x = x;
}
A.prototype.printx = function() // Write into class A this.printx = function.... It’s also possible, the same below
{
document.write(this.x, "
");
}

function B(x, y)
{
A.call(this, x);
this.y = y;
}
B.prototype = new A(); // Cannot take parameters!
B.prototype.printxy = function()
{
document.write(this.x, ", ", this.y, "
");
}

var b = new B(1, 2);
b.printx(); // Output 1
b.printxy(); // Output 1, 2
document.write(b instanceof A); // Output true

3. Use of similar static member functions

Copy code The code is as follows:
function sth(a)
{
this.a = a;
}

sth.fun = function(s)
{
document.write(s.a );
}

var s = new sth(2);
sth.fun(s); // Output 2


4. Release of objects

Copy code The code is as follows:
var obj = new Object; // obj is a reference
obj = null; // Dereference will automatically perform garbage collection; if you need to release this object at all, assign all its references to null

5. Function object

Copy code The code is as follows:
var v = new Function("arg1", "arg2", "document.write(arg1 arg2);"); // Define a function object, the parameters are arg1, arg2
v(1, 2); // Will Will output 3

6. Callback function

Copy code The code is as follows:
function callback (func, arg)
{
func(arg);
}

function fun(arg)
{
document.write(arg);
}

//callback(func, "sb"); // This approach does not work

var func = new Function("arg", "fun(arg);");
// Of course, you can also replace func(arg) with specific execution code,
// But it is best to do this if the function code is huge
callback(func, "sb");

7. Overloading of functions

Copy code The code is as follows:
function fun()
{
switch (arguments.length)
{
case 1:
document.write(arguments[0]);
break;
case 2 :
document.write(arguments[0] arguments[1]);
break;
default:
document.write("ERROR!");
break;
}
}

fun(1);
fun(1, 2);

8. Use function closures to implement functions with "static variables"

Copy code Code As follows:
function fun()
{
var v = 1;
function fun2()
{
v;
document.write(v);
document.write("
");
return v;
}

return fun2;
}

var func = fun() ;
func(); // Output 2
func(); // Output 3
func(); // Output 4
Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template