JavaScript高级应用入门

原创 2013年12月04日 09:45:48
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";

 

js_高级教程详细内容个人总结

1,数组的常用操作 push()方法可向数组的末尾添加一个或者多个元素,并返回新数组的长度, unshift() 方法可向数组的开头添加一个或更多元素,并返回新数组的长度。 Var arr ...
  • qq_28292937
  • qq_28292937
  • 2016年08月16日 20:48
  • 2618

JS高级应用(一)

页面跳转: window.location.href('地址') window.open('地址', '_self') 打开新窗口: window.open('地址',...
  • wanlixingzhe
  • wanlixingzhe
  • 2014年06月01日 14:33
  • 2735

JavaScript-高级进阶

day03-JavaScript高级 1、js的函数定义(三种方式)  一、使用关键字  function 方法名称(参数列表) { 方法体和返回值 }          注意1:参数列表中的参...
  • tujunyong
  • tujunyong
  • 2016年11月29日 23:50
  • 1309

js高级编程入门理解

1、js有对象吗,如果有对象,如何创建对象,对象里面的内容又是什么。 答:js有对象,通过 new 函数名创建对象,对象里面的内容是prototype上的内容下面我们案例测试window.onload...
  • u012316953
  • u012316953
  • 2016年09月26日 13:30
  • 2473

JavaScript高级技巧

下述内容主要讲述了《JavaScript高级程序设计(第3版)》第22章关于“高级技巧”。 一、高级函数函数是第一等公民,所有函数都是对象。1. 安全的类型检测JavaScript内置的类型检测机制并...
  • ligang2585116
  • ligang2585116
  • 2016年05月05日 21:13
  • 6227

JavaScript高级程序设计零碎知识点

1.包含在元素内部的JS代码会被从上到下依次解释,浏览器在对内部的所有代码求值完毕之前,页面中的其余内容都不会被浏览器加载或显示。 2.现代Web应用程序一般都把JavaScript的引用放到元素...
  • hellobeifeng
  • hellobeifeng
  • 2015年05月08日 15:49
  • 1207

智能社JavaScript学习笔记——13/14 - DOM操作应用 - 高级

表格应用1. 获取tBodies、tHead、tFoot、rows、cells 注意: 一个表格可以有多个tbody (所以tBodies是复数,是一个数组),但是只能有一个thead,一个tfoo...
  • namei33
  • namei33
  • 2015年06月03日 03:45
  • 781

关于Excel的几点高级应用

规划求解和数据透视工具。 规划求解题目使用规划求解设计获利最大的生产方案 创建数据透视表 根据当前生源情况信息创建数据透视表,统计不同地区的不同分数段的男生和女生的人数...
  • u014361352
  • u014361352
  • 2015年06月26日 10:53
  • 1135

ASP.NET高级应用

三层结构及其应用   概念及环境   ASP.NET中的三层结果开发方法,其实其思想跟Java的一样。Java中的三层架构为前端的html、Jsp、Servlet,中间层为JavaBean、EJB,后...
  • cosio
  • cosio
  • 2006年04月27日 09:50
  • 817

Hive高级应用

单行变多行 假设有个表有两个字段 key val1_val2_val3_val4_val5 想把第二个字段以“_”为分隔符切割成多行,如下: key val1 key val2 key v...
  • ljp812184246
  • ljp812184246
  • 2016年03月01日 15:57
  • 389
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:JavaScript高级应用入门
举报原因:
原因补充:

(最多只允许输入30个字)