JS中的prototype与面向对象的实例讲解


Posted in Javascript onMay 22, 2013
<script language="javascript" type="text/javascript">
         //(1)把一个方法变成一个对象,为对象创建方法和属性
         var Name = function () {
             //通过prototype给一个对象创建方法
             Name.prototype.Add = function (num, title) {
             }
             //也可以直接用this加方法名为对象创建方法和上面的等价
             this.Way = function (str) {
             }
             //为对象添加属性值
             Name.prototype.xing = "123";             //定义静态属性和方法
             Name.shi = "static";
             Name.Addd = function (num, title) {
             }
             //静态定义的局部属性和方法只能在静态的类型里面用
             alert(Name.shi);
             Name.Addd(1, 2);
         }
         //方法也可以这样声明
         function Name1() {
             Name1.prototype.add = function () { }
             this.way = function () { }
             Name1.prototype.shu = "other";
         }
         //静态定义的全局属性和方法通用
         Name.sha = "static";
         Name.Addd2 = function () {
         }
         alert(Name.sha); //调用静态属性
         Name.Addd2(); //调用静态方法
         var name = new Name();
         name.Add(); //对象调用方法
         name.Way();
         alert(name.xing); //对象调用属性
         /*静态的全局变量,在方法外可以调用;静态的局部变量和方法仅限于方法内使用;实例对象不能调用静态的方法 */
         /*实例对象不能使用prototype; */
 
         //(2)Javascript面向对象 继承
         //父类
         function Class() {
             this.name = "name";
             this.method = function () {
                 alert("method");
             }
         }
         //子类
         function Class1() {
             this.name1 = "name1";
             this.method1 = function () {
                 alert("method1");
             }
         }
         //子类继承父类
         Class1.prototype = new Class();
         var obj = new Class1();
         alert(obj.name);
         alert(obj.name1);
         obj.method();
         obj.method1();
         /******  子类继承父类的语法,子类.prototype=new 父类();  *****/
         //(3)子类重写父类
         //子类
         function Class2() {
             this.name2 = "name2";
             this.method2 = function () {
                 alert("method2");
             }
         }
         Class2.prototype = new Class(); //继承
         Class2.prototype.name = "updateName"; //重写父类的属性
         Class2.prototype.method = function () {//重写父类的方法
             alert("UpdateMethod");
         }
         var obj2 = new Class2();
         alert(obj2.name); //显示updateName
         obj2.method(); //显示UpdateMethod
         alert(obj2.name2);
         obj2.method2();
         //(4){}里面的为对象
         var arr = new Array();
         arr.push({ "name": "1", "age": 12, funA: function () { } });
         arr.push({ "name": "2", "age": 13 });
         arr.push({ "name": "3", "age": 14 });
         for (var i = 0; i < arr.length; i++) {
             alert(arr[i].name);
             alert(arr[i].age);
             alert(arr[i].funA());
         }
         /****一个对象也可以这么定义***/
         var newObject = {
             "name": "Jim",
             "sex": "Man",
              Way: function () { } 
         };
     </script>
Javascript 相关文章推荐
ExtJS 2.0实用简明教程 之ExtJS版的Hello
Apr 29 Javascript
jQuery.Validate 使用笔记(jQuery Validation范例 )
Jun 25 Javascript
js实现的跟随鼠标移动的时钟效果(中英文日期显示)
Jan 17 Javascript
jQuery Ajax异步处理Json数据详解
Nov 05 Javascript
JS实现淡入淡出图片效果的方法分析
Dec 20 Javascript
利用jquery实现实时更新歌词的方法
Jan 06 Javascript
Vue + Webpack + Vue-loader学习教程之相关配置篇
Mar 14 Javascript
Angular.JS内置服务$http对数据库的增删改使用教程
May 07 Javascript
浅谈angular.copy() 深拷贝
Sep 14 Javascript
JavaScript作用域链实例详解
Jan 21 Javascript
微信小程序实现购物页面左右联动
Feb 15 Javascript
深入了解JavaScript 私有化
May 30 Javascript
JS定时关闭窗口的实例
May 22 #Javascript
jquery自定义属性(类型/属性值)
May 21 #Javascript
jquery实现智能感知连接外网搜索
May 21 #Javascript
JQuery调webservice实现邮箱验证(检测是否可用)
May 21 #Javascript
Extjs407 getValue()和getRawValue()区别介绍
May 21 #Javascript
js获得指定控件输入光标的坐标兼容IE,Chrome,火狐等多种主流浏览器
May 21 #Javascript
深入理解javaScript中的事件驱动
May 21 #Javascript
You might like
php下连接mssql2005的代码
2011/01/17 PHP
色色整理的PHP面试题集锦
2012/03/08 PHP
php中的一些数组排序方法分享
2012/07/20 PHP
php中如何判断一个网页请求是ajax请求还是普通请求
2013/08/10 PHP
使用YUI+Ant 实现JS CSS压缩
2014/09/02 PHP
Codeigniter的dom类用法实例
2015/06/26 PHP
PHP的CURL方法curl_setopt()函数案例介绍(抓取网页,POST数据)
2016/12/14 PHP
在JavaScript中使用inline函数的问题
2007/03/08 Javascript
JavaScript设计模式之抽象工厂模式介绍
2014/12/28 Javascript
使用mouse事件实现简单的鼠标经过特效
2015/01/30 Javascript
JavaScript中消除闭包的一般方法介绍
2015/03/16 Javascript
JavaScript如何自定义trim方法
2015/07/28 Javascript
详解JS去重及字符串奇数位小写转大写
2016/12/29 Javascript
微信小程序侧边栏滑动特效(左右滑动)
2017/01/23 Javascript
Vue仿手机qq的实例代码(demo)
2017/09/08 Javascript
微信小程序使用image组件显示图片的方法【附源码下载】
2017/12/08 Javascript
vuejs使用axios异步访问时用get和post的实例讲解
2018/08/09 Javascript
koa-router路由参数和前端路由的结合详解
2019/05/19 Javascript
js和jquery判断数据类型的4种方法总结
2020/08/28 jQuery
[01:18]PWL开团时刻DAY4——圣剑与抢盾
2020/11/03 DOTA
python实现的登陆Discuz!论坛通用代码分享
2014/07/11 Python
跟老齐学Python之Python安装
2014/09/12 Python
Python cookbook(字符串与文本)在字符串的开头或结尾处进行文本匹配操作
2018/04/20 Python
python 自定义异常和异常捕捉的方法
2018/10/18 Python
使用django和vue进行数据交互的方法步骤
2019/11/11 Python
Python3.7下安装pyqt5的方法步骤(图文)
2020/05/12 Python
爱尔兰最大的体育零售商:Life Style Sports
2019/06/12 全球购物
俄罗斯奢侈品牌衣服、鞋子和配饰的在线商店:INTERMODA
2020/07/17 全球购物
艺术设计专业个人求职信
2014/04/10 职场文书
知识竞赛拉拉队口号
2014/06/16 职场文书
继承公证书格式
2015/01/26 职场文书
爱晚亭导游词
2015/02/09 职场文书
营业员岗位职责范本
2015/04/14 职场文书
现货白银电话营销话术
2015/05/29 职场文书
解决使用了nginx获取IP地址都是127.0.0.1 的问题
2021/09/25 Servers
德生2P3收音机开箱评测
2022/04/30 无线电