js定义类的方法示例【ES5与ES6】
本文实例讲述了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>
运行结果:
上面这样用构造函数和原型混合的方法定义类,是为了每次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>
运行结果:
注意:类名首字母要大写
(另:原文代码中class Point(x,y)
定义会导致运行错误,本文予以修正。)
感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具:http://tools.jb51.net/code/HtmlJsRun测试上述代码运行效果。
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《javascript面向对象入门教程》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》
希望本文所述对大家JavaScript程序设计有所帮助。
相关推荐
-
Javascript 自定义类型方法小结
1. 定义类型 复制代码 代码如下: function UserObject(parameter) { } parameter 可省略,相当于C#中构造函数参数. 2. 实例化自定义类型 复制代码 代码如下: <script type="text/javascript"> function userobject(parameter){ } //myobject is now an object of type userobject! var myobject=new use
-
关于JavaScript定义类和对象的几种方式
可以看看这个例子: 复制代码 代码如下: var a = 'global'; (function () { alert(a); var a = 'local'; })(); 大家第一眼看到这个例子觉得输出结果是什么?'global'?还是'local'?其实都不是,输出的是undefined,不用迷惑,我的题外话就是为了讲这个东西的. 其实很简单,看一看JavaScript运行机制就会明白.我们可以把这种现象看做"预声明".但是如果稍微深究一下,会明白得更透彻. 这里其实涉及到对象属性
-
javascript面向对象之一 定义类
javascript中的类是用函数function表示的,如下: 复制代码 代码如下: function Student() { //定义类Student中的字段,并赋予初值,但此字段的访问权限是public this.studentNo = 's001'; this.studentName = '小明'; this.sex = '男'; //定义类Student中的方法updateStudentName ,用于修改studentName 值 this.updateStudentName = f
-
Javascript定义类(class)的三种方法详解
将近20年前,Javascript诞生的时候,只是一种简单的网页脚本语言.如果你忘了填写用户名,它就跳出一个警告. 如今,它变得几乎无所不能,从前端到后端,有着各种匪夷所思的用途.程序员用它完成越来越庞大的项目. Javascript代码的复杂度也直线上升.单个网页包含10000行Javascript代码,早就司空见惯.2010年,一个工程师透露,Gmail的代码长度是443000行! 编写和维护如此复杂的代码,必须使用模块化策略.目前,业界的主流做法是采用"面向对象编程".因此,Ja
-
JavaScript定义类或函数的几种方式小结
提起面向对象我们就能想到类,对象,封装,继承,多态.在<javaScript高级程序设计>(人民邮电出版社,曹力.张欣译.英文名字是:Professional JavaScript for Web Developers)这本书中描述的还算比较详细.我们看看JavaScript中定义类的各种方法. 1.工厂方式 javaScript中创建自己的类和对象,我们应该是必须掌握的,我们都知道javaScript中对象的属性可以在对象创建后动态定义,比如下面的代码: 复制代码 代码如下: <scr
-
javascript来定义类的规范小结
使用javascript来定义类的规范如下: 指定类名与构造函数,类名(构造函数名)首字母大写: 复制代码 代码如下: function YourClass(){ } 使用"this.成员变量"在其构造函数内定义(伪)私有成员,最好约定(伪)私有成员都以"_"开头小写字母组成.这种成员是每个对象都有自己的副本,也叫对象(实例)成员. 复制代码 代码如下: function Yourclass(_arg1,_arg2,...){ this._arg1=arg1; th
-
JS定义类的六种方式详解
在前端开发中,经常需要定义JS类.那么在JavaScript中,定义类的方式有几种,分别是什么呢?本文就JS定义类的六中方式说明如下(案例说明): 1.工厂方式 function Car(){ var ocar = new Object; ocar.color = "blue"; ocar.doors = 4; ocar.showColor = function(){ document.write(this.color) }; return ocar; } var car1 = Car
-
ES6中class类用法实例浅析
本文实例讲述了ES6中class类用法.分享给大家供大家参考,具体如下: 类语法是ES6中新增的一个亮点特色.我们熟悉的JavaScript终于迎来了真正意义上的类.在之前,想要通过javascript来实现类,通常会采用如下构造函数的模式: function Person(name,age,job){ this.name = name; this.age = age; this.job = job; this.friends = ['Shelby','Court']; } Person.pro
-
ES6新特性之类(Class)和继承(Extends)相关概念与用法分析
本文实例讲述了ES6新特性之类(Class)和继承(Extends)相关概念与用法.分享给大家供大家参考,具体如下: 一.类(Class) 1.基本语法 JavaScript语言的传统方法是通过构造函数,定义并生成新对象.下面是一个例子 function Point(x, y) { this.x = x; this.y = y; } Point.prototype.toString = function () { return '(' + this.x + ', ' + this.y + ')'
-
JavaScript定义类的几种方式总结
提起面向对象我们就能想到类,对象,封装,继承,多态.在<javaScript高级程序设计>(人民邮电出版社,曹力.张欣译.英文名字是:Professional JavaScript for Web Developers)这本书中描述的还算比较详细.我们看看JavaScript中定义类的各种方法. 1.工厂方式 javaScript中创建自己的类和对象,我们应该是必须掌握的,我们都知道javaScript中对象的属性可以在对象创建后动态定义,比如下面的代码: 复制代码 代码如下: <scr
-
老生常谈ES6中的类
前面的话 大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScript 6中引入了类的特性.本文将详细介绍ES6中的类 ES5近似结构 在ES5中没有类的概念,最相近的思路是创建一个自定义类型:首先创建一个构造函数,然后定义另一个方法并赋值给构造函数的原型 function PersonType(name) { this.name = name; } Person
随机推荐
- Asp中随机产生用户密码的代码
- 解决html-jquery/js引用外部图片时遇到看不了或出现403的问题
- ajax请求乱码的解决方法(中文乱码)
- JS正则替换掉小括号及内容的方法
- Java 中IO流字符流详解及实例
- Oracle一个用户如何访问其它用户的表应用指南
- 如何让C#、VB.NET实现复杂的二进制操作
- 局域网内部署 Docker Registry(推荐)
- PHP,ASP.JAVA,JAVA代码格式化工具整理
- 一个方便AJAX开发的通用类
- 功能强大的Bootstrap效果展示(二)
- jquery动画效果学习笔记(8种效果)
- 如何将一个String和多个String值进行比较思路分析
- javascript验证身份证完全方法具体实现
- 关于代理上传图片到主控网站的说明
- Java线程中断的本质深入理解
- c# Winform 程序自动更新实现方法
- Android应用中使用Fragment组件的一些问题及解决方案总结
- Android手势滑动实现ImageView缩放图片大小
- Android6.0动态申请权限所遇到的问题小结