ES6之Class类
一、Class的基本语法
1、简介
基本上,ES6的class可以看作只是一个 语法糖,它的绝大部分功能,ES5都可以做到,新的class写法只是让 对象原型 的写法更加清晰、更像面向对象编程的语法而已。
如果要生成一个对象实例,需要先定义一个构造函数,然后通过new操作符来完成。构造函数实例:
//函数名和实例化构造名相同并且大写(有助于区分构造函数和普通函数)
function Person(name,age){
this.name = name;
this.age = age;
}
Person.prototype.read = function(){
return "我的名字叫" + "this.name" + "今年" + this.age + "岁了";
}
var obj = new Person("一诺",18);//通过构造函数创建对象,使用new
console.log(obj.read()) //结果:我的名字叫一诺今年18岁了。
上面代码的代码用ES6改写:
class Person{ //定义一个名为Person的类
constructor(name,age){ //constructor是一个构造方法,用来接收参数
this.name = name;
this.age = age;
}
read(){
return "我的名字叫" + this.name + "今年" + this.age + "岁了"
}
}
var obj = new Person ("一诺",18)
console.log(obj.read()) //我的名字叫一诺今年18岁了
constructor方法是类的构造函数的默认方法,通过new 命令生成对象实例时,自动调用该方法。
class Box{
constructor(){
console.log("这个礼拜天气不错"); //当实例化对象时该行代码会执行
}
}
var obj = new Box();
class Desk{
constructor(){
this.ss = "大千世界,无奇不有";
}
}
class Box{
constructor(){
return new Desk();//没有用this,直接返回一个全新的对象
}
}
var obj = new Box();
console.log(obj.ss) //大千世界,无奇不有
class不错在变量提升,所以需要先定义再使用。因为ES6不会把类的声明提升到代码的头部,但是ES5就不一样,ES5存在变量提升,可以先使用,然后再定义
2、静态方法
类相当于实例的原型,所有再类中定义的方法,都会被实例继承。如果再一个方法前加上static关键字,就 表示该方法不会被实例继承,而是直接通过类来调用,这就称为静态方法
ES6之Class类的更多相关文章
- Nodejs与ES6系列4:ES6中的类
ES6中的类 4.1.class基本语法 在之前的javascript语法中是不存在class这样的概念,如果要通过构造函数生成一个新对象代码 function Shape(width,height) ...
- ES6中的类
前面的话 大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScri ...
- 深入理解ES6之——JS类的相关知识
基本的类声明 类声明以class关键字开始,其后是类的名称:剩余部分的语法看起来像对象字面量中的方法简写,并且在方法之间不需要使用逗号. class Person { //等价于prototype的构 ...
- ES6中的类和继承
class的写法及继承 JavaScript 语言中,生成实例对象的传统方法是通过构造函数.下面是一个例子 function Point(x, y) { this.x = x; this. ...
- ES6中的类继承和ES5中的继承模式详解
1.ES5中的继承模式 我们先看ES5中的继承. 既然要实现继承,首先我们得要有一个父类. Animal.prototype.eat = function(food) { console.log(th ...
- 160803、如何在ES6中管理类的私有数据
如何在ES6中管理类的私有数据?本文为你介绍四种方法: 在类的构造函数作用域中处理私有数据成员 遵照命名约定(例如前置下划线)标记私有属性 将私有数据保存在WeakMap中 使用Symbol作为私有属 ...
- ES6里关于类的拓展(二):继承与派生类
继承与派生类 在ES6之前,实现继承与自定义类型是一个不小的工作.严格意义上的继承需要多个步骤实现 function Rectangle(length, width) { this.length = ...
- ES6里关于类的拓展(一)
大多数面向对象的编程语言都支持类和类继承的特性,而JS却不支持这些特性,只能通过其他方法定义并关联多个相似的对象,这种状态一直延续到了ES5.由于类似的库层出不穷,最终还是在ECMAScript 6中 ...
- es6入门5--class类的基本用法
在ES6之前,准确来说JavaScript语言并无类的概念,却有模拟类的做法.相比在类似java这类传统面向对象语言中通过类来生成实例,js则通过构造函数模拟类来生成实例. 这是因为在JS设计初期,作 ...
- TypeScript完全解读(26课时)_7.ES6精讲 - 类Class基础
ES6精讲 - 类Class基础 es5中创建构造函数和实例 原来在es5中的写法 定义好Point后,在原型对象上定义getPostion的方法 实例自身是没有这个方法的,我们调用的时候会去创建他的 ...
随机推荐
- virtualenv 在windows下的简单应用
https://docs.python.org/zh-cn/3/tutorial/venv.html cmd下的操作: pip install virtualenv pip install virt ...
- 16.Django学习之文件上传和下载
上传就这么六步! 一. settings配置文件中配置 MEDIA_URL = '/media/' MEDIA_ROOT = os.path.join(BASE_DIR, 'medias').repl ...
- Django中直接执行SQL语句
欢迎加入python学习交流群 667279387 今天在django views.py看到同事写的代码里面有段关于数据库查询的语句.因为涉及多个表的查询,所以django 的models的查询无法满 ...
- openstack Mitaka实验环境安装(centos系统)
本博文仅供参考,具体一定详细学习官方安装文档. 一 准备工作 二安装过程 1 安装NTP服务 2 安装openstack包 3 SQL数据库安装 4 安装消息队列 message queue 5 Me ...
- Java修炼——Set的子接口Vector的方法使用
Vector的方法和ArrayList相似 package com.bjsxt.Array; import java.util.Iterator; import java.util.List; imp ...
- EasyUI整合SpringBoot,Spring Data对数据的分页操作
EasyUI的用法可以看中文官网,看插件是如何使用的 EasyUI中文官网 前端页面 <table id="dg" title="My Users" cl ...
- [TimLinux] JavaScript querySelectorAll返回对象无法使用indexOf问题
1. querySelectorAll 该函数返回的对象类型为NodeList,这个类型并没有indexOf方法,如果需要使用indexOf方法,需要先将该对象每一项转存入Array对象中,然后就可以 ...
- Python3 数据结构之词频统计(英文)
import string path = r'C:\Users\Black\Desktop\Walden.txt' with open(path, 'r', encoding='utf-8') as ...
- 【JS】369- 20个常用的JavaScript字符串方法
点击上方"前端自习课"关注,学习起来~ 作者:前端小智 https://segmentfault.com/a/1190000020204425 本文主要介绍一些最常用的JS字符串函 ...
- 【Git】安装配置
[Git]安装配置 转载:https://www.cnblogs.com/yangchongxing/p/10173231.html 1.在 Ubuntu 上安装 $ sudo apt-get ins ...