粗看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; } ...
随机推荐
- 电路中IC器件电压符号的解释
在电子芯片.运算处理器等集成电路行业中,存在多种电压.常用的的有:VDDQ->The supply voltage to output buffers of a memory chip 存储芯片 ...
- codeforces-473D Mahmoud and Ehab and another array construction task (素数筛法+贪心)
题目传送门 题目大意:先提供一个数组,让你造一个数组,这个数组的要求是 1 各元素之间都互质 2 字典序大于等于原数组 3 每一个元素都大于2 思路: 1.两个数互质的意思就是没有公因子.所以每 ...
- Codeforces Round #482 (Div. 2) C 、 Kuro and Walking Route(dfs)979C
题目链接:http://codeforces.com/contest/979/problem/C 大致题意 给出n个点,有n-1个边将他们链接.给出x,y,当某一路径中出现x....y时,此路不通.路 ...
- Go语言基础练习题系列1
1.练习1 题目:使用fmt分别打印字符串.二进制.十进制.十六进制.浮点数. package main import ( "fmt" ) func main() { var a ...
- 【Effective Java】阅读
Java写了很多年,很惭愧,直到最近才读了这本经典之作<Effective Java>,按自己的理解总结下,有些可能还不够深刻 一.Creating and Destroying Obje ...
- appium ios 真机自动化环境搭建
近期由于工作需要,本小菜在弄appium+ios+iphone真机的移动自动化,在网上找寻各种资料,发现针对IOS方面的资料少之又少,公司其它部门的弄过的同事也寥寥无几,即使有,也是安卓方面的.本次书 ...
- 使用spyder编译器单步调试python
1.将需要进行单步调试的函数在脚本中进行调用(十分重要的一步).由于python是解释型语言,在进行单步调试的时候需要告诉系统你使用了这个函数,单步调试才会进入你所需要调式的函数.如下图所示,我们定义 ...
- uva 815之理解诡异的海平线题目之不容易
首先题意:(这个真的令人无奈,题目都看不太明白) 网上百度了一下,就是以下意思: 给你n*m个格子,每个格子的面积是10*10米,整个区域外看作无限高的墙壁.输入每个格子的海拔高度(可能为负数),以及 ...
- forEach与map
一.原生js forEach()和map()遍历 共同点: 1.都是循环遍历数组中的每一项. 2.forEach() 和 map() 里面每一次执行匿名函数都支持3个参数:数组中的当前项item,当前 ...
- 搭建python开发环境
1.下载python3.6并安装 .网址:https://www.python.org/downloads/windows/ 安装完在cmd看输入“python"是否能够出现python版本 ...