粗看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; } ...
随机推荐
- Go语言在线培训哪里好？Git操作和代码管理
在实际的项目开发过程中,多人进行项目开发,需要涉及到代码管理和协同管理.这就需要使用到代码协同管理工具.在过去,大家都熟悉使用的是SVN软件,而现在Git代码仓库管理软件的使用更为广泛.在本系列实战项 ...
- ASP前端控件设置只读不要用enabled
会导致后台取不到这个控件的值,应该用readonly
- 字串变换 bfs + 字符串
题目描述 已知有两个字串A,BA,BA,B及一组字串变换的规则(至多666个规则): A1A_1A1 ->B1 B_1B1 A2A_2A2 -> B2B_2B2 规则的含义为:在 ...
- Jenkins利用官网上的rpm源安装
官网网址:https://pkg.jenkins.io/redhat/ (官网上有安装的命令,参考网址) 安装jdk yum install -y java-1.8.0- ...
- window 使用频率最高的快捷键
window 使用频率最高的快捷键 一个电脑使用者不完全一切操作都靠鼠标 适当的快捷键 不但可以提高效率 而且还可以适当的装一下自己是大神啦啦啦 个人最常用的快捷键: Ctrl + c : 复制 C ...
- APP设计规范
设计师DPI指南 本指南旨在为初级到中级设计人员提供“入门”或介绍性阅读,他们希望从一开始就学习或获得有关跨DPI和跨平台设计的更多知识. 尽可能少的数学和没有不可解析的图形,只需在简短的部分中订购直 ...
- 11. 变量提升 && 执行上下文
/* 变量升级 预处理 */ /* js引擎在代码正式执行之前会做一个预处理的工作: 1.收集变量 2.收集函数 依据: var 将var后边的变量定义但不赋值 var username=undefi ...
- vs快捷键（SharePoint项目）
1.ctrl+c,alt+c,shift+ctrl+c: ========== Copying to SharePoint Root =========={ProjectRoot}\pkg\Debug ...
- spoj COT - Count on a tree(主席树 +lca,树上第K大)
您将获得一个包含N个节点的树.树节点的编号从1到Ñ.每个节点都有一个整数权重. 我们会要求您执行以下操作: uvk:询问从节点u到节点v的路径上的第k个最小权重 输入 在第一行中有两个整数Ñ和中号.( ...
- input只能输入非负数
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...