归纳下js面向对象的几种常见写法总结


Posted in Javascript onAugust 24, 2016

//定义Circle类,拥有成员变量r,常量PI和计算面积的成员函数area() 

1.工厂方式

var Circle = function() {
  var obj = new Object();
  obj.PI = 3.14159;
  
  obj.area = function( r ) {
    return this.PI * r * r;
  }
  return obj;
}

var c = new Circle();
alert( c.area( 1.0 ) );

2.比较正规的写法

function Circle(r) {
   this.r = r;
}
Circle.PI = 3.14159;
Circle.prototype.area = function() {
 return Circle.PI * this.r * this.r;
}

var c = new Circle(1.0);  
alert(c.area());

3.json写法

var Circle={
  "PI":3.14159,
 "area":function(r){
     return this.PI * r * r;
    }
};
alert( Circle.area(1.0) );

4.有点变化,但是实质和第一种一样

var Circle=function(r){
    this.r=r;
}
Circle.PI = 3.14159; 
Circle.prototype={
  area:function(){
    return this.r*this.r*Circle.PI;
  }
}
var obj=new Circle(1.0);
alert(obj.area())

Circle.PI = 3.14159; 能够放入属性中写成this.PI=3.14159;

常用为第一种和第三种

第三种写法的扩展小实例

var show={
    btn:$('.div1'),
    init:function(){
      var that=this;
      alert(this);
      this.btn.click(function(){
          that.change();
          alert(this);
        })
      
    },
    change:function(){
      this.btn.css({'background':'green'});

    }
  }
  show.init();

需要注意的是this的指向问题

以上这篇归纳下js面向对象的几种常见写法总结就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Jquery作者John Resig自己封装的javascript 常用函数
Nov 09 Javascript
js跟随滚动条滚动浮动代码
Dec 31 Javascript
JS实现淘宝幻灯片效果的实现方法
Mar 22 Javascript
jQuery $.extend()用法总结
Jun 15 Javascript
JavaScript中关联原型链属性特性
Feb 13 Javascript
JavaScript中Promise的使用详解
Feb 26 Javascript
轻松实现jQuery添加删除按钮Click事件
Mar 13 Javascript
JS中判断某个字符串是否包含另一个字符串的五种方法
May 03 Javascript
详解JS转换数值函数Number()、parseInt()、parseFloat()
Aug 24 Javascript
详解Node.js读写中文内容文件操作
Oct 10 Javascript
JS使用百度地图API自动获取地址和经纬度操作示例
Apr 16 Javascript
vue.js Router中嵌套路由的实用示例
Jun 27 Vue.js
BootStrap iCheck插件全选与获取value值的解决方法
Aug 24 #Javascript
js友好的时间返回函数
Aug 24 #Javascript
JS转换HTML转义符的方法
Aug 24 #Javascript
gulp-uglify 与gulp.watch()配合使用时报错(重复压缩问题)
Aug 24 #Javascript
JS判断是否在微信浏览器打开的简单实例(推荐)
Aug 24 #Javascript
jquery实现ajax提交表单信息的简单方法(推荐)
Aug 24 #Javascript
AngularJS下对数组的对比分析
Aug 24 #Javascript
You might like
smarty中先strip_tags过滤html标签后truncate截取文章运用
2010/10/25 PHP
如何用PHP实现插入排序?
2013/04/10 PHP
执行、获取远程代码返回:file_get_contents 超时处理的问题详解
2013/06/25 PHP
PHP连接sql server 2005环境配置及问题解决
2014/08/08 PHP
WebQQ最新登陆协议的用法
2014/12/22 PHP
PHP测试成功的邮件发送案例
2015/10/26 PHP
Expandable "Detail" Table Rows
2007/08/29 Javascript
符合标准的js表单提交的代码
2007/09/13 Javascript
extjs DataReader、JsonReader、XmlReader的构造方法
2009/11/07 Javascript
关于jQuery的inArray 方法介绍
2011/10/08 Javascript
关于递归运算的顺序测试代码
2011/11/30 Javascript
javascript获取select的当前值示例代码(兼容IE/Firefox/Opera/Chrome)
2013/12/17 Javascript
js图片延迟技术一般的思路与示例
2014/03/20 Javascript
vue.js开发环境安装教程
2017/03/17 Javascript
详解Vue2 SSR 缓存 Api 数据
2017/11/20 Javascript
vue.js使用v-if实现显示与隐藏功能示例
2018/07/06 Javascript
layer弹出层父子页面事件相互调用方法
2018/08/17 Javascript
详解一个基于react+webpack的多页面应用配置
2019/01/21 Javascript
vue+echarts实现可拖动节点的折线图(支持拖动方向和上下限的设置)
2019/04/12 Javascript
vue router 跳转时打开新页面的示例方法
2019/07/28 Javascript
js简单的分页器插件代码实例
2019/09/11 Javascript
vue自定义标签和单页面多路由的实现代码
2020/05/03 Javascript
浅谈python 里面的单下划线与双下划线的区别
2017/12/01 Python
如何使用python操作vmware
2019/07/27 Python
python实现从wind导入数据
2019/12/03 Python
Python爬虫实现百度翻译功能过程详解
2020/05/29 Python
Python如何实现后端自定义认证并实现多条件登陆
2020/06/22 Python
python批量提取图片信息并保存的实现
2021/02/05 Python
Spartoo葡萄牙鞋类网站:线上销售鞋履与时尚配饰
2017/01/11 全球购物
加拿大领先的牛仔零售商:Bluenotes
2018/01/22 全球购物
为女性购买传统的印度服装和婚纱:Kalkifashion
2019/07/22 全球购物
高中军训感言600字
2014/03/11 职场文书
营销总监岗位职责
2014/09/16 职场文书
2019年自助餐厅创业计划书模板
2019/08/22 职场文书
MySQL 数据类型详情
2021/11/11 MySQL
Qt数据库应用之实现图片转pdf
2022/06/01 Java/Android