js定义类的方法示例【ES5与ES6】


Posted in Javascript onJuly 30, 2019

本文实例讲述了js定义类的方法。分享给大家供大家参考,具体如下:

以下是es5标准里定义类的方法:

<script>
function Point(x,y){
  this.x=x;
  this.y=y;
}
Point.prototype.toString=function(){
  return '('+this.x+', '+this.y+')';
}
var point=new Point(1,2);
console.log(point);
</script>

运行结果:

js定义类的方法示例【ES5与ES6】

上面这样用构造函数和原型混合的方法定义类,是为了每次new新实例时可以共享方法,不用创建function新实例。所以只有函数属性放在原型对象里定义,其他属性都在构造函数里定义。

es6里简化了类的定义方法:

<script>
class Point{
   constructor(x,y){
    this.x=x;
    this.y=y;
    }
    toString(){
     return '('+this.x+', '+this.y+')';
    }
}
let point=new Point(3,4);
console.log(point);
</script>

运行结果:

js定义类的方法示例【ES5与ES6】

注意:类名首字母要大写

另:原文代码中class Point(x,y)定义会导致运行错误,本文予以修正。)

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.3water.com/code/HtmlJsRun测试上述代码运行效果。

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript面向对象之this关键词用法分析
Jan 13 Javascript
在javascript中随机数 math random如何生成指定范围数值的随机数
Oct 21 Javascript
Bootstrap Table服务器分页与在线编辑应用总结
Aug 08 Javascript
jquery延迟对象解析
Oct 26 Javascript
javascript填充默认头像方法
Feb 22 Javascript
详解如何在微信小程序中愉快地使用sass
Jul 30 Javascript
vue.js使用v-model实现表单元素(input) 双向数据绑定功能示例
Mar 08 Javascript
JavaScript从原型到原型链深入理解
Jun 03 Javascript
基于jquery ajax的多文件上传进度条过程解析
Sep 11 jQuery
layui table 列宽百分比显示的实现方法
Sep 28 Javascript
vue中进行微博分享的实例讲解
Oct 14 Javascript
微信小程序如何实现精确的日期时间选择器
Jan 21 Javascript
Javascript 对象(object)合并操作实例分析
Jul 30 #Javascript
JavaScript跳出循环的三种方法(break, return, continue)
Jul 30 #Javascript
8个有意思的JavaScript面试题
Jul 30 #Javascript
开源一个微信小程序仪表盘组件过程解析
Jul 30 #Javascript
原生js添加一个或多个类名的方法分析
Jul 30 #Javascript
vue2.0项目集成Cesium的实现方法
Jul 30 #Javascript
Koa从零搭建到Api实现项目的搭建方法
Jul 30 #Javascript
You might like
Valerio 发布了 Mootools
2006/09/23 Javascript
在IE上直接编辑网页内容的js代码(IE地址栏js)
2009/04/27 Javascript
JavaScript 获取事件对象的注意点
2009/07/29 Javascript
javascript操作cookie的文章(设置,删除cookies)
2010/04/01 Javascript
return false;和e.preventDefault();的区别
2010/07/11 Javascript
JavaScript 5 新增 Array 方法实现介绍
2012/02/06 Javascript
JSONP 跨域共享信息
2012/08/16 Javascript
ext中store.load跟store.reload的区别示例介绍
2014/06/17 Javascript
浅谈js键盘事件全面控制
2016/12/01 Javascript
Angular.js实现获取验证码倒计时60秒按钮的简单方法
2017/10/18 Javascript
关于Vue的路由权限管理的示例代码
2018/03/06 Javascript
vue实现点击追加选中样式效果
2019/11/01 Javascript
js找出5个数中最大的一个数和倒数第二大的数实现方法示例小结
2020/03/04 Javascript
[01:00:22]DOTA2-DPC中国联赛定级赛 LBZS vs Magma BO3第三场 1月10日
2021/03/11 DOTA
Python内置函数bin() oct()等实现进制转换
2012/12/30 Python
最基础的Python的socket编程入门教程
2015/04/23 Python
Python优化技巧之利用ctypes提高执行速度
2016/09/11 Python
浅谈pandas用groupby后对层级索引levels的处理方法
2018/11/06 Python
Python实现SQL注入检测插件实例代码
2019/02/02 Python
解决python文件双击运行秒退的问题
2019/06/24 Python
python区块及区块链的开发详解
2019/07/03 Python
OpenCV3.0+Python3.6实现特定颜色的物体追踪
2019/07/23 Python
浅谈Python3 numpy.ptp()最大值与最小值的差
2019/08/24 Python
Python 类,property属性(简化属性的操作),@property,property()用法示例
2019/10/12 Python
Python 实现数组相减示例
2019/12/27 Python
python如何实现不可变字典inmutabledict
2020/01/08 Python
在pycharm中文件取消用 pytest模式打开的操作
2020/09/01 Python
联想中国官方商城:Lenovo China
2017/10/18 全球购物
英国高街电视:High Street TV
2018/05/22 全球购物
美国班级戒指、帽子和礼服、毕业产品、年鉴:Balfour
2018/11/01 全球购物
创建精神文明单位实施方案
2014/03/08 职场文书
校园广播稿100字
2014/10/06 职场文书
财务人员岗位职责
2015/02/03 职场文书
青年教师个人总结
2015/02/11 职场文书
写给医护人员的一封感谢信
2019/09/16 职场文书
DjangoRestFramework 使用 simpleJWT 登陆认证完整记录
2021/06/22 Python