懂视1
懂视101
懂视201
懂视301
懂视401
懂视501
懂视601
懂视701
懂视801
懂视901
懂视1001
懂视1101
懂视1201
懂视1301
懂视1401
懂视1501
懂视1601
懂视1701
懂视1801
懂视1901
文库1
文库101
文库201
文库301
文库401
文库501
文库601
文库701
文库801
文库901
文库1001
文库1101
文库1201
文库1301
文库1401
文库1501
文库1601
文库1701
文库1801
文库1901
九壹网
全部频道
首页
科技
教育
生活
旅游
时尚
美容
美食
健康
体育
游戏
汽车
家电
您的当前位置：
首页
JavaScript中级笔记第五章面向对象的基础_javascript技巧
JavaScript中级笔记第五章面向对象的基础_javascript技巧
来源：九壹网
一，面向对象的基础
对象是JavaScript的基础。从最基本的层次上说，对象是一系列属性的集合。
1,对象的创建
//创建一个新的Object对象，存放在obj变量中 var obj1 = new Object(); //设置属性 obj1.value = 5; obj1.click = function(){ alert("Hello"); } //另一种方式定义一个对象，以键值(key/value)的方式定义属性 var obj2 = { value : 5, click : function(){ alert("Hello"); } }; </ script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
相信很多朋友对这些创建对象的方式接触过很多次了，都很熟悉了。
2，对象的使用
和其他面向对象语言不同的是，JavaScript没有类的概念。在JavaScript里，任何函数都可以被实例化为一个对象。
//一个简单的函数，接受名称并将其放入当前上下文中 function User(name){ this.name = name; } var me = new User("cssrain");//指定名称来创建该函数的一个新对象 alert( me.name );//"cssrain" alert( me.constructor == User );//true //如果把User当作函数 User("peter"); alert( window.name );//因为它的this上下文对象未设定，所以默认是全局的window对象 </ script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
本段代码通过new User()来创建函数的一个新的对象。创建出的新对象拥有name属性，并且construtor属性指向创建它的函数。
3，公共方法
公共方法是在对象的上下文中用户始终可以接触到的。要实现这种方法，需要用到原型属性——prototype。
对象的原型仍然是对象。给原型对象添加属性后，由该原型实例化的每个对象都可以访问这些属性，即这些属性都是公有化的。
//一个简单的函数，接受名称并将其放入当前上下文中 function User(name){ this.name = name; } //将一个新的函数添加到此对象的prototype对象中 User.prototype.getName = function(){ return this.name; } var me = new User("cssrain");//指定名称来创建该函数的一个新对象 alert( me.getName() ); //"cssrain" </ script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
4，私有方法
这个还比较好理解。字面意思是只能在内部访问。
//一个简单的函数，接受名称并将其放入当前上下文中 function User(name){ this.name = name; function disp(){ alert("User()函数 私有的"); } //只能内部调用 disp(); } var me = new User("cssrain");//指定名称来创建该函数的一个新对象 //me.disp();//不能调用 //disp();//不能调用 </ script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
5，方法
它是以公共的方式访问私有变量。
function User(name,age){ //私有变量 var year = (new Date()).getFullYear()-age; //创建一个方法，能够访问year变量，同时属于公共可访问 this.getBornYear = function(){ return year; } } var me = new User("cssrain",22);//指定参数来创建该函数的一个新对象 alert( me.getBornYear() );//"1986" </ script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
本质上，方式是动态生成的。因为它们是在运行时才添加到对象中的，而不是在代码第一次编译时就已经生成。
这种动态生成代码的能力不可小视，能根据与你想那个时变量来生成代码是非常有用的。看下面动态生成方法的例子：
function User( users ){ for(var i in users){//遍历所有的属性 (function(method){ var p = i; method["get"+p]=function(){//创建此属性的一个读取函数 return users[p]; } method["set"+p]=function(val){//创建此属性的一个设置函数 users[p] = val; } })(this); } } var me = new User({name : "cssrain", age : 22});//指定参数来创建该函数的一个新对象 alert( me.getname() );//"cssrain" alert( me.getage() );//"22" me.setname("changeCssRain"); me.setage(23); alert( me.getname() );//"changeCssRain" alert( me.getage() );//"23" </ script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
6，静态方法
静态方法的实质跟一般函数没有什么不同，静态方法能保证对象的命名空间的整洁。
function User(name,age){ this.name = name; this.age = age; } //添加到一个User对象的静态方法 User.cloneUser = function(user){ //创建并返回一个新的User对象 return new User( user.name , user.age ); } var u = User.cloneUser({name:"cssrian",age:22}); alert(u.name);//"cssrain" alert(u.age);//22 </ script>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
二，小结
理解本章所描述的概念和内容是非常重要的， 这是完全掌握专业JavaScript的起点。
显示全文