粗看ES6之面向对象写法
标签： es6
在es6以前，js没有类的概念，虽然有构造函数原型的方式用来做面向对向开发，但是对于书法并不是十分友好，而且对于继承实现也不是十分友好。
es6引入class constructor extends super等关键字简化了JS面向对象写法，以后可以跟后端说JS也终于是有类的一门语言了，哈哈。
ES6的面向对象写法如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>es6面向对象写法</title>
</head>
<body>
<script>
//js类写法
class Test{
constructor(a,b){
this.attr0 = a;
this.attr1 = b;
}
fn(){
console.log(this.attr0,this.attr1)
}
}
//初始化方法和以前构造函数原型方式一样，都是通过new关键字
var testFn = new Test(1,2);
testFn.fn();
</script>
</body>
</html>
es6通过extends super实现继承
示例代码如下：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>es6面向对象继承写法</title>
</head>
<body>
<script>
//js类写法,Test类
class Parent{
constructor(a,b){
this.attr0 = a;
this.attr1 = b;
}
fn(){
console.log(this.attr0,this.attr1);
}
}
//写一个继承自Parent的类
class Child extends Parent{
constructor(a,b,c){
super(a,b);//实现继承parent上的方法&属性
this.attr2 = c;
}
fn0(){
console.log(this.attr2);
}
}
//初始化方法和以前构造函数原型方式一样，都是通过new关键字
var testFn = new Child(1,2,3);
testFn.fn();
testFn.fn0();
</script>
</body>
</html>
个人觉得自此jser真的可以愉快的进行面向对象编程了，666666，同时祝all新年快乐！！
粗看ES6之面向对象写法的更多相关文章
- 粗看ES6之JSON
标签: es6 ES6新增JSON特性不是特别多,只是针对JSON某些情况下的写法上有一些优化: 当key值和value值对应变量名相同时 json对像中的方法书写 示例代码如下: <!DOCT ...
- 粗看ES6之函数
标签: es6 javascript 箭头函数 ES6为了书写方便引入了函数的全新简写方式-箭头函数 <!DOCTYPE html> <html> <head> & ...
- 粗看ES6之字符串
标签: javascript es6 字符串新增特性 新增二个方法 - startsWith/endsWith 字符串模板 - 反单引号的应用 startsWith 判断字符串以是否以某某开头,返回一 ...
- 粗看ES6之数组
标签: javascript es6 数组新增方法 map(可以理解为是映射,以一定规则修改数组每一项并返回全新数组) reduce(可以理解为是汇总,一堆出来一个) filter(可以理解为过滤,筛 ...
- 粗看ES6之解构赋值
标签: javascript es6 什么是解构赋值? 示例如下: <!DOCTYPE html> <html> <head> <meta charset=& ...
- 粗看ES6之变量
标签: javascript var定义变量面临的问题 可以重复定义 无法限制变量不可修改 无块级作用域 ES6变量定义升级 新增let定义变量 新增const定义常量 let特性 有块级作用域 不可 ...
- 新手必看ES6基础
ES6 基础 一.新的变量声明方式 let/const 与var不同,新的变量声明方式带来了一些不一样的特性,其中最重要的两个特性就是提供了块级作用域与不再具备变量提升. 通过2个简单的例子来说明这两 ...
- es6中的面向对象写法
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http ...
- ES6 的面向对象
JavaScript 语言中,生成实例对象的传统方法是通过构造函数. function Animal(name, age) { this.name = name; this.age = age; } ...
随机推荐
- 识别子串 (string)——后缀自动机+线段树
题目 [题目描述] 一般地,对于一个字符串 S,和 S 中第 $ i $ 个字符 x,定义子串 $ T=S(i.j) $ 为一个关于 x 的识别子申,当且仅当: 1.$ i \leq x \leq j ...
- socketserver,threading
一,socketserver #server import socketserver class Myserver(socketserver.BaseRequestHandler): def han ...
- Jmeter-逻辑控制器之Switch控制器（Switch Controller）
Switch控制器(Switch Controller): 作用:Switch控制器通过给该控制器中的Value赋值,来指定运行哪个采样器.有两种赋值方式: 第一种是数值,Switch控制器下的子节点 ...
- POJ1511 Invitation Cards SPFA算法裸题变形
原题目:http://poj.org/problem?id=1511 给出一个有向图,求出这个图从1到所有点的最短路径和所有点到1的最短路径的和. 这题数据量有点大,数据范围也大,所以用SPFA+邻接 ...
- 云搜索服务在APP搜索场景的应用
搜索无处不在,尤其是在移动互联的今天.无论是社交,电商,还是视频等APP中,搜索都已经在其中扮演了重要的角色.作为信息的入口,搜索能帮用户从海量信息中找到想要的信息.在APP搜索的典型场景如下: ● ...
- 牛客寒假算法基础集训营4 I Applese 的回文串
链接:https://ac.nowcoder.com/acm/contest/330/I来源:牛客网 自从 Applese 学会了字符串之后,精通各种字符串算法,比如……判断一个字符串是不是回文串. ...
- docker搭建数据库主从复制
首先需要安装docker镜像: docker pull mysql:5.7 由于需要启动数据库才可以进入数据修改my.cnf文件,可以选择安装vi命令,也可以选择挂在 在此选择是挂载的方法进行安装: ...
- 7 . 动态sql-choose
choose-when-otherwise 只能满足一个when 中的条件,互斥的条件,不能同时存在 mapper.xml <select id="selectstateByTitle ...
- VC对话框的菜单设置变灰， 打勾 等
一般可以用UPDATE_COMMAND_UI消息,并加入以下代码:pCmdUI->Enable(FALSE); 就实现,弹对话框的菜单需要增加对WM_INITMENUPOPUP消息的处理以后,才 ...
- css3 matrix 矩阵
2D矩阵变换 matrix(1,0,0,1,0,0) 对应 matrix (a,b,c,d,e,f) 其中,x, y表示转换元素的所有坐标(变量)了, 3*3矩阵每一行的第1个值与后面1*3的第1个值 ...