浅谈Javascript的静态属性和原型属性


Posted in Javascript onMay 07, 2015

文章给各位介绍Javascript的静态方法和原型方法一个例子,如果大家对于Javascript的静态方法和原型方法不了解可以和小编一起来看看。 一段代码,了解静态方法和实例方法:

<script>
    //对象构造函数
    function Atest(name){
      //私有属性,只能在对象构造函数内部使用
      var className = "Atest";
      //公有属性,在对象实例化后调用
      this.name = name;
      //对象方法
      this.hello = function(){
        alert(this.name);
        alert(this.msg());//使用原型方法扩充的方法可以在类内部使用
        alert(this.sex);//使用原型方法扩充的属性可以在类内部使用
        alert(Atest.age);//静态属性调用时格式为[对象.静态属性]
      }
    }
    //类方法 (实际是静态方法直接调用) 位置:Person类的外部 语法格式:类名称.方法名称 = function([参数...]){ 语句行; }
    Atest.Run = function(){
      alert("我是类方法 Run");
    }
 
 
    //原型方法
    Atest.prototype.msg = function(){
      alert("我的名字是:"+this.name);//如果原型方法当作静态方法直接调用时,this.name无法被调用
    }
 
    //公有静态属性 在类的外部
    Atest.age = 20;//公有静态属性不能使用 【this.属性】,只能使用 【对象.属性】 调用
 
    //原型属性,当作是类内部的属性使用【this.原型属性】,也可以当成公有静态属性使用【对象.prototype.原型属性】
    Atest.prototype.sex = "男";
 
    Atest.Run(); //类方法也是静态方法,可以直接使用 【对象.静态方法()】
    Atest.prototype.msg();//原型方法当成静态方法使用时【对象.prototype.方法()】 
    alert(Atest.prototype.sex);//原型属性当作静态属性使用时【对象.prototype.方法()】
    var a = new Atest("zhangsan");//对象方法和原型方法需要实例化对象后才可以使用
    a.hello();//对象方法必须实例化对象
    a.msg();//原型方法必须实例化对象
    alert(a.age)://错误,公有静态属性只能使用 【对象.属性】调用
 
    //ps:尽量将方法定义为原型方法,原型方法避免了每次调用构造函数时对属性或方法的构造,节省空间,创建对象快.
  </script>
Javascript 相关文章推荐
JavaScript中json使用自己总结
Aug 13 Javascript
jQuery统计上传文件大小的方法
Jan 24 Javascript
jQuery插件pagewalkthrough实现引导页效果
Jul 05 Javascript
jQuery插件实现图片轮播特效
Jun 16 Javascript
详解jQuery停止动画——stop()方法的使用
Dec 14 Javascript
Angularjs实现搜索关键字高亮显示效果
Jan 17 Javascript
jQuery插件imgAreaSelect基础讲解
May 26 jQuery
jQuery validata插件实现方法
Jun 25 jQuery
AngularJS基于http请求实现下载php生成的excel文件功能示例
Jan 23 Javascript
详解VUE Element-UI多级菜单动态渲染的组件
Apr 25 Javascript
React组件对子组件children进行加强的方法
Jun 23 Javascript
nuxt 自定义 auth 中间件实现令牌的持久化操作
Nov 05 Javascript
ECMAScript5(ES5)中bind方法使用小结
May 07 #Javascript
JS中获取函数调用链所有参数的方法
May 07 #Javascript
jQuery中animate动画第二次点击事件没反应
May 07 #Javascript
js实现鼠标滑过文字链接色彩变化的效果
May 06 #Javascript
JS实现文字掉落效果的方法
May 06 #Javascript
DOM 高级编程
May 06 #Javascript
js获得当前系统日期时间的方法
May 06 #Javascript
You might like
php在apache环境下实现gzip配置方法
2015/04/02 PHP
php的无刷新操作实现方法分析
2020/02/28 PHP
ASP Json Parser修正版
2009/12/06 Javascript
IFrame跨域高度自适应实现代码
2012/08/16 Javascript
如何使用Jquery获取Form表单中被选中的radio值
2013/08/09 Javascript
JQuery页面的表格数据的增加与分页的实现
2013/12/10 Javascript
基于NodeJS的前后端分离的思考与实践(六)Nginx + Node.js + Java 的软件栈部署实践
2014/09/26 NodeJs
JS取得绝对路径的实现代码
2015/01/16 Javascript
使用Angular和Nodejs、socket.io搭建聊天室及多人聊天室
2015/08/21 NodeJs
跟我学习javascript的prototype,getPrototypeOf和__proto__
2015/11/17 Javascript
js实现获取两个日期之间所有日期的方法
2016/06/17 Javascript
jquery 动态合并单元格的实现方法
2016/08/26 Javascript
Node.js 日志处理模块log4js
2016/08/28 Javascript
jQuery实现移动端手机商城购物车功能
2016/09/24 Javascript
Node中使用ES6语法的基础教程
2018/01/05 Javascript
nodejs搭建本地服务器并访问文件操作示例
2019/05/11 NodeJs
Vue实现滑动拼图验证码功能
2019/09/15 Javascript
有趣的JavaScript隐式类型转换操作实例分析
2020/05/02 Javascript
解决Antd Table组件表头不对齐的问题
2020/10/27 Javascript
Python的Django中将文件上传至七牛云存储的代码分享
2016/06/03 Python
Python-copy()与deepcopy()区别详解
2019/07/12 Python
Python中and和or如何使用
2020/05/28 Python
HTML5 与 XHTML2
2008/10/17 HTML / CSS
泰国王权免税店官方网站:KingPower
2019/03/11 全球购物
解释一下抽象方法和抽象类
2016/08/27 面试题
自学考试自我鉴定范文
2013/09/26 职场文书
班组长岗位职责
2014/03/03 职场文书
婚庆司仪主持词
2014/03/15 职场文书
局火灾防控工作方案
2014/05/25 职场文书
汽车技术服务与贸易专业求职信
2014/07/20 职场文书
学习优秀党员杨宗兴先进事迹材料思想汇报
2014/09/14 职场文书
社区党建工作总结2015
2015/05/13 职场文书
社区扶贫帮困工作总结
2015/05/20 职场文书
后天观后感
2015/06/08 职场文书
CSS使用伪类控制边框长度的方法
2022/01/18 HTML / CSS
html5调用摄像头截图功能
2022/01/18 Javascript