我们说类的时候,先回忆一下es5的构造函数

  function myobj(x,y){
this.x= x;
this.y =y;
} myobj.prototype.add = function(){
return this.x+this.y
} var num = new myobj(10,5); console.log(num.add()); //

这是构造函数的写法,到了es6出现clss类的写法。下面代码等价于上面的代码

class muobj{
constructor(x,y){
this.x = x;
this.y = y;
}
add(){
return this.x+this.y
}
} var numb = new myobj(10,5); console.log(numb.add()); //

在上面的代码中我们可以看到出现了关键字class,它可以和对象模板定义一个类。

可以在上面我们看到了一个 constructor 它是es6的构造方法,而this指向实例的对象。

constructor方法是类的默认方法,通过new命令生成对象实例时,自动调用该方法。一个类必须有constructor方法,如果没有显式定义,一个空的constructor方法会被默认添加。

也就是说es6的构造方法对应es5构造函数

class定义的类,里的方法都是直接定义在原型上的。

   class b{
s(){}
d(){}
} // 等价于
function b(){}
b.prototype = {
s(){},
d(){}
}

而且class定义的类都是是不能枚举的。

属性表达式的写法

let myname = "getdata";

    class stk {
constructor(x){
this.x =x;
}
[myname](){
return this.x
}
} var stkn = new stk("好");
console.log(stkn.getdata()); //好

上面我们定义一个变量,并且赋值“getdata”,在书写类的时候使用 [myname] 表达式。

我们使用的时候,使用的是getdata,并不是myname了。

class表达式的写法

 //class 表达式
const myc = class me{
constructor(x){
this.x =x
}
} let hu = new myc('李四');
console.log(hu.x); //李四

采用 Class 表达式,可以写出立即执行的 Class。

name属性

name属性用于获得class类名

class Point {}
Point.name // "Point"

Generator 方法

如果某个方法之前加上星号(*),就表示该方法是一个 Generator 函数。

class Foo {
constructor(...args) {
this.args = args;
}
* [Symbol.iterator]() {
for (let arg of this.args) {
yield arg;
}
}
} for (let x of new Foo('hello', 'world')) {
console.log(x);
}
// hello
// world

this指向问题

在使用的过程中可能会存出现  TypeError: Cannot read property 'XXXX' of undefined

很可能是this的指向问题。

建议的写法就是使用箭头函数

先暂停一下。我去回头补上

原文地址:https://es6.ruanyifeng.com/#docs/class

class初探的更多相关文章

  1. 初探领域驱动设计(2)Repository在DDD中的应用

    概述 上一篇我们算是粗略的介绍了一下DDD,我们提到了实体.值类型和领域服务,也稍微讲到了DDD中的分层结构.但这只能算是一个很简单的介绍,并且我们在上篇的末尾还留下了一些问题,其中大家讨论比较多的, ...

  2. CSharpGL(8)使用3D纹理渲染体数据 (Volume Rendering) 初探

    CSharpGL(8)使用3D纹理渲染体数据 (Volume Rendering) 初探 2016-08-13 由于CSharpGL一直在更新,现在这个教程已经不适用最新的代码了.CSharpGL源码 ...

  3. 从273二手车的M站点初探js模块化编程

    前言 这几天在看273M站点时被他们的页面交互方式所吸引,他们的首页是采用三次加载+分页的方式.也就说分为大分页和小分页两种交互.大分页就是通过分页按钮来操作,小分页是通过下拉(向下滑动)时异步加载数 ...

  4. JavaScript学习(一) —— 环境搭建与JavaScript初探

    1.开发环境搭建 本系列教程的开发工具,我们采用HBuilder. 可以去网上下载最新的版本,然后解压一下就能直接用了.学习JavaScript,环境搭建是非常简单的,或者说,只要你有一个浏览器,一个 ...

  5. .NET文件并发与RabbitMQ(初探RabbitMQ)

    本文版权归博客园和作者吴双本人共同所有.欢迎转载,转载和爬虫请注明原文地址:http://www.cnblogs.com/tdws/p/5860668.html 想必MQ这两个字母对于各位前辈们和老司 ...

  6. React Native初探

    前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...

  7. 【手把手教你全文检索】Apache Lucene初探

    PS: 苦学一周全文检索,由原来的搜索小白,到初次涉猎,感觉每门技术都博大精深,其中精髓亦是不可一日而语.那小博猪就简单介绍一下这一周的学习历程,仅供各位程序猿们参考,这其中不涉及任何私密话题,因此也 ...

  8. Key/Value之王Memcached初探:三、Memcached解决Session的分布式存储场景的应用

    一.高可用的Session服务器场景简介 1.1 应用服务器的无状态特性 应用层服务器(这里一般指Web服务器)处理网站应用的业务逻辑,应用的一个最显著的特点是:应用的无状态性. PS:提到无状态特性 ...

  9. NoSQL初探之人人都爱Redis:(3)使用Redis作为消息队列服务场景应用案例

    一.消息队列场景简介 “消息”是在两台计算机间传送的数据单位.消息可以非常简单,例如只包含文本字符串:也可以更复杂,可能包含嵌入对象.消息被发送到队列中,“消息队列”是在消息的传输过程中保存消息的容器 ...

  10. Unity3D游戏开发初探—1.跨平台的游戏引擎让.NET程序员新生

    一.Unity3D平台简介 Unity是由Unity Technologies开发的一个让轻松创建诸如三维视频游戏.建筑可视化.实时三维动画等类型互动内容的多平台的综合型游戏开发工具,是一个全面整合的 ...

随机推荐

  1. Jmeter系列(30)- 详解 JDBC Request

    如果你想从头学习Jmeter,可以看看这个系列的文章哦 https://www.cnblogs.com/poloyy/category/1746599.html 前言 JDBC Request 主要是 ...

  2. Python初识类与对象

    Python初识类与对象 类与对象 世界观角度分析类与对象 类是一个抽象的概念,而对象是一个实体的存在,对象由类创造而出,每个对象之间互相独立互不影响,一个对象可以同时拥有多个类的方法,实例化就是通过 ...

  3. Illegal reflective access by org.apache.hadoop.security.authentication.util.KerberosUtil

    在使用Java API操作HBase时抛出如下异常: Illegal reflective access by org.apache.hadoop.security.authentication.ut ...

  4. 3分钟理解NMS非极大值抑制

    1. NMS被广泛用到目标检测技术中,正如字面意思,抑制那些分数低的目标,使最终框的位置更准: 2. 假如图片上实际有10张人脸,但目标检测过程中,检测到有30个框的位置,并且模型都认为它们是人脸,造 ...

  5. python文件处理-将图像根据坐标切割成若干小图

    代码涉及到:遍历目标路径,选取csv后缀的文件,遍历csv每一行,读取坐标,用cv操作图片 # !/usr/bin/python # -*- coding: UTF- -*- import panda ...

  6. Flask项目实战:创建电影网站(3)后台的增删改查

    添加预告 根据需求数据库创建表格 需求数据库,关键字title logo # 上映预告 class Preview(db.Model): __tablename__ = "preview&q ...

  7. unable to load script from assets 'index.android bundle'

    在Android手机上运行React-native项目时 报错:unable to load script from assets 'index.android bundle'  ,make sure ...

  8. springboot 整合retry(重试机制)

    当我们调用一个接口可能由于网络等原因造成第一次失败,再去尝试就成功了,这就是重试机制,spring支持重试机制,并且在Spring Cloud中可以与Hystaix结合使用,可以避免访问到已经不正常的 ...

  9. 新建maven项目总是需要重新选择maven的配置文件

    解决办法: other settings->settings for new projects... 找到maven设置自己的目录和配置

  10. asp.net core 发布包含文件

    这样这个文件在发布的时候,就会包含进去了.