浅谈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 相关文章推荐
js怎么覆盖原有方法实现重写
Sep 04 Javascript
jQuery实现复选框成对选择及对应取消的方法
Mar 03 Javascript
JS实现文字掉落效果的方法
May 06 Javascript
浅谈JS继承_借用构造函数 &amp; 组合式继承
Aug 16 Javascript
文件上传的几个示例分享【推荐】
Dec 16 Javascript
微信小程序 支付后台java实现实例
May 09 Javascript
利用node.js实现反向代理的方法详解
Jul 24 Javascript
angular $watch 一个变量的变化(实例讲解)
Aug 02 Javascript
vue根据值给予不同class的实例
Sep 29 Javascript
微信小程序中的上拉、下拉菜单功能
Mar 13 Javascript
关于vue 结合原生js 解决echarts resize问题
Jul 26 Javascript
原生JS实现京东查看商品点击放大
Dec 21 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多个版本的分析解释
2011/07/21 PHP
PHP中串行化用法示例
2016/11/16 PHP
浅谈php中变量的数据类型判断函数
2017/03/04 PHP
解决php扩展安装不生效问题
2019/10/25 PHP
js 方法实现返回多个数据的代码
2009/04/30 Javascript
input按钮的事件处理大全
2010/12/10 Javascript
artDialog双击会关闭对话框的修改过程分享
2013/08/05 Javascript
JavaScript打印iframe内容示例代码
2013/08/20 Javascript
基于JavaScript代码实现自动生成表格
2016/06/15 Javascript
jQuery实现邮箱下拉列表自动补全功能
2016/09/08 Javascript
jQuery过滤选择器用法示例
2016/09/12 Javascript
微信小程序入门教程
2016/11/18 Javascript
Bootstrap源码解读网格系统(3)
2016/12/22 Javascript
详解Angular2中Input和Output用法及示例
2017/05/21 Javascript
图片懒加载imgLazyLoading.js使用详解
2020/09/15 Javascript
javascript填充默认头像方法
2018/02/22 Javascript
原生JS+HTML5实现的可调节写字板功能示例
2018/08/30 Javascript
详解如何用webpack4从零开始构建react开发环境
2019/01/27 Javascript
[03:46]DOTA2英雄基础教程 维萨吉
2013/12/11 DOTA
[06:21]2014DOTA2国际邀请赛 庆祝VG首阶段领跑;B叔为挣牛排半夜整理情报
2014/07/13 DOTA
在Python的Django框架中更新数据库数据的方法
2015/07/17 Python
基于循环神经网络(RNN)实现影评情感分类
2018/03/26 Python
Selenium鼠标与键盘事件常用操作方法示例
2018/08/13 Python
为什么Python中没有&quot;a++&quot;这种写法
2018/11/27 Python
python爬虫项目设置一个中断重连的程序的实现
2019/07/26 Python
Python手绘可视化工具cutecharts使用实例
2019/12/05 Python
Python集合操作方法详解
2020/02/09 Python
如何使用repr调试python程序
2020/02/28 Python
Python中remove漏删和索引越界问题的解决
2020/03/18 Python
HTML5 UTF-8 中文乱码的解决方法
2013/11/18 HTML / CSS
影视制作岗位职责
2013/12/04 职场文书
解除劳动合同证明书
2014/09/26 职场文书
学习党的群众路线剖析材料
2014/10/09 职场文书
清洁工个人工作总结
2015/03/05 职场文书
导游词之西安骊山
2019/12/03 职场文书
Python加密技术之RSA加密解密的实现
2022/04/08 Python