您的位置:首页 > Web前端 > JavaScript

JavaScript高级应用入门

2013-12-04 09:45 369 查看
function class1(){
//类成员的定义及构造函数
}
var obj = new class1();
alert(typeof obj);

 备注:从上面的代码可以看出,在JavaScript函数和类是同一个概念,当new一个函数时,这个函数就是所代表类的构造函数,其中的所有代码都可以看做为初始化一个对象的工作

使用方括号([])应用对象的属性和方法

var arr = new Array();
arr.push("abc");
alert(arr.length);
alert(arr["length"]);

 使用大括号{}语法创建无类型对象,除了最后一个属性(方法)定义,其他的必须以逗号结尾

var user={
name:"jack",
favoriteColor:["red","green","black","white"],
hello:function(){
alert("hello,"+this.name);
},
sex:"male"
}

 每个函数其实也是一个对象,对应的类是Function,并且每个函数对象都具有一个子对象prototype,prototype实际上就是表示了一个类的成员集合

function test(){
}
test.prototype.name = "huangbiao";
alert(test.prototype.name);
//test.name是无法识别的
alert(test.name);
var obj = new test();
alert(obj.name);

var obj = {"001":"huangbiao"};
alert(obj["001"]);

function myFunction(a,b){
return a+b;
}
//等价于
var myFunction=new Function("a","b","return a+b");

var funcName=new Function(p1,p2,...,pn,body);

下面三种方式是等价的
new Function("a", "b", "c", "return a+b+c")
new Function("a, b, c", "return a+b+c")
new Function("a,b", "c", "return a+b+c")

 

注意直接在函数声明后面加上括号就表示创建完成后立即进行函数调用,例如:

var i=function (a,b){
return a+b;
}(1,2);
alert(i);

 因为括号比等号的优先级更高,所以先执行方法,然后再赋值。这段代码会显示变量i 的值等于3

function funcName(){
//函数体
}
//等价于
var funcName=function(){
//函数体
}

 如果需要在页面载入时进行一些初始化工作,可以先定义一个init的初始化函数,再通过window.onload=init;语句将其绑定到页面载入完成的事件。这里的init就是一个函数对象,它可以加入window的onload事件列表,也正源于它的对象本质,这和C语言、C++语言的函数指针概念有很大的相似性。

apply和call,它们的作用都是将函数绑定到另外一个对象上去运行

使用JavaScript模拟“类”的属性?

function class2() {
//相当于类的private类型
var string = "huangbiao";
//相当于类的属性
this.str = string;
this.method1 = function () {
alert("hello" +this.str);
}
}
var obj = new class2();
//闭包,属性为私有的,只能通过对外的接口访问内部属性
alert(obj.string);//undefined
alert(class2.string);//undefined
//alert(string);页面会报错,无法识别string
alert(obj.str); //相当于类的属性
obj.method1();//hellohuangbiao

 

 

 

备注:原型对象的定义必须在创建实例语句之前,否则不起作用

function class2(){
this.prop = 1;
//运行下面这个方法报错,因为还没有识别
this.showProp();
}
var obj = new class2();//没有利用到prototype这个属性,这样会报错
class2.prototype.showProp=function(){
alert(this.prop);
}

正确写法是

function class2(){
this.prop = 1;
this.showProp();
}
class2.prototype.showProp=function(){
alert(this.prop);
}
var obj = new class2();

  

 

构造方法

function class2(){
alert(1);
}
class2.prototype.constructor();

 

利用JavaScript设计类的模式?

function classT(){
//构造函数
}
classT.prototype={
property1:property1,
property1:property1,
...
method1:function(){
//method1
},
method2:function(){
//method2
}
}

 类是private,public的属性和方法

function classT(){
//定义私有变量
var pp="this is private property";
//方法类的私有方法
function pm(){
alert(pp);
}
this.method1 = function(){
//在公有成员中改变私有变量
pp = "pp has been changed";
}
this.method2 = function(){
//在公有成员中调用私有方法
pm();
}
}
var obj = new classT();
obj.method1();
obj.method2();

 

静态static变量和方法的使用

function classT(){
//构造方法
}
//静态属性
classT.staticProperty="staticProperty";
//静态方法
classT.staticMethod = function(){
alert("staticMethod");
return "ok";
}
alert(classT.staticProperty);
alert(classT.staticMethod());

 

如果要给每个函数对象添加通用的静态方法,则可以通过函数对象对应的Function来实现

Function.prototype.showArgs=function(){
alert(this.length);//显示函数定义的形参个数
}
function class1(a){
//定义一个类
}
//class1相当于Function这个类new的一个对象,所以可以按照下面这样的方式使用
class1.showArgs();

 

JavaScript的反射机制(for( ... in ..))
反射机制指的是程序在运行时能够获取自身的信息

for(var p in obj){
if(typeof obj[p] == "function"){
obj[p]();
}else{
alert(obj[p]);
}
}

利用共享prototype实现继承
function classParent(){
//构造函数
}
function classSon(){
//构造函数
}
classSon.prototype = classParent.prototype;
classSon.prototype.moreProperty1="moreProperty1";
classSon.prototype.moreMethod1=function(){
//方法实现的代码
}
var obj = new classSon();

使用JSON格式实现“继承”的方法
function parent(){
//构造方法
}
parent.prototype={
property:"abc";
method:function(){
alert("abc");
}
}
function son(){
//构造函数
}
//让son继承parent
son.prototype=parent.prototype;
son.prototype.method=function(){
alert("new method");
}
son.prototype.newPrototype="newPrototype";

 
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: