浅谈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 相关文章推荐
Node.js实战 建立简单的Web服务器
Mar 08 Javascript
SeaJS入门教程系列之SeaJS介绍(一)
Mar 03 Javascript
jQuery实现长按按钮触发事件的方法
Feb 02 Javascript
基于jQuery 实现bootstrapValidator下的全局验证
Dec 07 Javascript
Kindeditor在线文本编辑器如何过滤HTML
Apr 14 Javascript
Js+Ajax,Get和Post在使用上的区别小结
Jun 08 Javascript
浅谈Vue.js 1.x 和 2.x 实例的生命周期
Jul 25 Javascript
微信小程序checkbox组件使用详解
Jan 31 Javascript
浅谈ajax请求不同页面的微信JSSDK问题
Feb 26 Javascript
JavaScript遍历DOM元素的常见方式示例
Feb 16 Javascript
vuejs数据超出单行显示更多,点击展开剩余数据实例
May 05 Javascript
Nuxt pages下不同的页面对应layout下的页面布局操作
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输出xml格式字符串(用的这个)
2012/07/12 PHP
thinkphp 一个页面使用2次分页的实现方法
2013/07/15 PHP
php提示Failed to write session data错误的解决方法
2014/12/17 PHP
tp5.1 实现setInc字段自动加1
2019/10/18 PHP
js 获取、清空input type=&quot;file&quot;的值(示例代码)
2013/12/24 Javascript
jquery常用方法及使用示例汇总
2014/11/08 Javascript
node.js中的http.response.write方法使用说明
2014/12/14 Javascript
解决bootstrap中modal遇到Esc键无法关闭页面
2015/03/09 Javascript
javascript引用类型之时间Date和数组Array
2015/08/27 Javascript
用Vue.extend构建消息提示组件的方法实例
2017/08/08 Javascript
vue父组件向子组件(props)传递数据的方法
2018/01/02 Javascript
微信小程序实现随机验证码功能
2018/12/20 Javascript
「中高级前端面试」JavaScript手写代码无敌秘籍(推荐)
2019/04/08 Javascript
javascript定时器的简单应用示例【控制方块移动】
2019/06/17 Javascript
layer.js之回调销毁对话框的例子
2019/09/11 Javascript
JavaScript Dom 绑定事件操作实例详解
2019/10/02 Javascript
node.js中process进程的概念和child_process子进程模块的使用方法示例
2020/02/11 Javascript
JavaScript实现指定数量的并发限制的示例代码
2020/03/10 Javascript
python进阶教程之词典、字典、dict
2014/08/29 Python
Python爬虫抓取手机APP的传输数据
2016/01/22 Python
python列表的增删改查实例代码
2018/01/30 Python
Python cookbook(数据结构与算法)根据字段将记录分组操作示例
2018/03/19 Python
Python 加密与解密小结
2018/12/06 Python
python使用threading.Condition交替打印两个字符
2019/05/07 Python
python对象与json相互转换的方法
2019/05/07 Python
Python操作redis实例小结【String、Hash、List、Set等】
2019/05/16 Python
python实现LBP方法提取图像纹理特征实现分类的步骤
2019/07/11 Python
基于Python新建用户并产生随机密码过程解析
2019/10/08 Python
社团文化节邀请函
2014/01/10 职场文书
节约用水标语
2014/06/11 职场文书
仓库管理制度范本
2015/08/04 职场文书
高中16字霸气押韵班级口号集锦!
2019/06/27 职场文书
详解nodejs内置模块
2021/05/06 NodeJs
Django中的JWT身份验证的实现
2021/05/07 Python
SQL Server代理:理解SQL代理错误日志处理方法
2021/06/30 SQL Server
为什么MySQL分页用limit会越来越慢
2021/07/25 MySQL