石川es6课程---9、面向对象-基础
石川es6课程---9、面向对象-基础
一、总结
一句话总结:
js老版本的面向对象和继承都不是很方便,新版的面向对象向其它语言靠拢,有了class,extends,constructor等关键字,用法和其它语言(例如php)也很像了
class User {
constructor(name, pass) {
this.name = name
this.pass = pass
} showName() {
console.log(this.name)
}
showPass() {
console.log(this.pass)
}
} var u1 = new User('able2', '111')
u1.showName()
u1.showPass() // 新版本继承
class VipUser extends User {
constructor(name, pass, level) {
super(name, pass)
this.level = level
}
showLevel(){
console.log(this.level)
}
} v1 = new VipUser('blue', '123', 3)
v1.showLevel()
二、面向对象-基础
原来写法
- 类和构造函数一样
- 属性和方法分开写的
// 老版本
function User(name, pass) {
this.name = name
this.pass = pass
} User.prototype.showName = function () {
console.log(this.name)
}
User.prototype.showPass = function () {
console.log(this.pass)
} var u1 = new User('able', '1233')
u1.showName()
u1.showPass()
// 老版本继承
function VipUser(name, pass, level) {
User.call(this, name, pass)
this.level = level
}
VipUser.prototype = new User()
VipUser.prototype.constructor = VipUser
VipUser.prototype.showLevel = function () {
console.log(this.level)
} var v1 = new VipUser('blue', '1234', 3)
v1.showName()
v1.showLevel()
新版面向对象
- 有了 class 关键字、构造器
- class 里面直接加方法
- 继承,super 超类==父类
class User {
constructor(name, pass) {
this.name = name
this.pass = pass
} showName() {
console.log(this.name)
}
showPass() {
console.log(this.pass)
}
} var u1 = new User('able2', '111')
u1.showName()
u1.showPass() // 新版本继承
class VipUser extends User {
constructor(name, pass, level) {
super(name, pass)
this.level = level
}
showLevel(){
console.log(this.level)
}
} v1 = new VipUser('blue', '123', 3)
v1.showLevel()
石川es6课程---9、面向对象-基础的更多相关文章
- 石川es6课程---1-2、ES6简介
石川es6课程---1-2.ES6简介 一.总结 一句话总结: 从ECMAScript的历史发展来看,太顺了的时候总会遇到一挫折,比如ecma4 1.ECMAScript 和 JavaScript关系 ...
- 石川es6课程---18、ES6 复习
石川es6课程---18.ES6 复习 一.总结 一句话总结: 无论在讲课和学习中,复习总结都是很重要 二.ES6 复习 变量 let const 声明方式 能否重复声明 作用域 类型 是否支持变量提 ...
- 石川es6课程---17、ES7 预览
石川es6课程---17.ES7 预览 一.总结 一句话总结: 人的价值恒定规律:无论得意还是迷茫之时,你的价值都不靠外界的评判或者你内心的悲喜而决定.而是当时的恒定的.能够提升他只能靠你提升自己的能 ...
- 石川es6课程---13-16、generator-认识生成器函数
石川es6课程---13-16.generator-认识生成器函数 一.总结 一句话总结: ` generator函数,中间可以停,到哪停呢,用 yield 配合,交出执行权 ` 需要调用next() ...
- 石川es6课程---12、Promise
石川es6课程---12.Promise 一.总结 一句话总结: 用同步的方式来书写异步代码,让异步书写变的特别简单 用同步的方式来书写异步代码Promise 让异步操作写起来,像在写同步操作的流程, ...
- 石川es6课程---11、json
石川es6课程---11.json 一.总结 一句话总结: ` 感觉更方便了一点,增加了一些简写 ` key-value 一样时可以简写:console.log({ a,b}}) ` 里面函数可以简写 ...
- 石川es6课程---8、字符串
石川es6课程---8.字符串 一.总结 一句话总结: · es6字符串新增两个方法:startsWith(以什么开头),endsWith(以什么结尾) · 新增反单引号:可以解析变量,可以折行:le ...
- 石川es6课程---7、数组
石川es6课程---7.数组 一.总结 一句话总结: ^ 主要就map(映射:一个对一个),reduce(汇总:一堆出来一个),filter 过滤器,forEach 循环(迭代) 四个方法 ^ 使用 ...
- 石川es6课程---6、解构赋值
石川es6课程---6.解构赋值 一.总结 一句话总结: 结构相同一一对应的方式赋值:let [json, arr, num, str] = [{ a: 1, b: 2 }, [1, 2, 3], 8 ...
随机推荐
- vue项目使用openlayers来添加地图标注,标注样式设置的简要模板
先把代码贴出来,注释以后有时间再写(需要留意一下这里图标的引入方式,函数内相同路径无法找到图片) import sk from "../../assets/img/home/sk-activ ...
- XSS防御和绕过1
原理:对用户输入没做过滤和处理,是用户可以输入一些东西(例如js),控制输出达到一些攻击目的 1.DOM型 基于DOM的XSS有时也称为type0XSS.当用户能够通过交互修改浏览器页面中的DOM(D ...
- python 文本相似度计算
参考:python文本相似度计算 原始语料格式:一个文件,一篇文章. #!/usr/bin/env python # -*- coding: UTF-8 -*- import jieba from g ...
- Hadoop 上Hive 的操作
数据dept表的准备: --创建dept表 CREATE TABLE dept( deptno int, dname string, loc string) ROW FORMAT DELIMITED ...
- Invalid property value
又见这个错误!头几天同事遇到这个问题,我查到去年写的并按此解决了,原文在这里,查了半天,才查出是ftShortInt造成的这个错误. 当我们在设计期将ClientQuery.Active设置为True ...
- MySql学习笔记【三、表相关操作】
创建表 CREATE TABLE [IF NOT EXISTS] table_name( column_name data_type, ... ) 如: CREATE TABLE test_table ...
- HttpClient 源码阅读
在项目中常用的HttpClient,与我们非常的亲密,为了能处理遇到的Http问题,我们应该去了解里面的机制和实现. 官方文档:http://hc.apache.org/httpcomponents- ...
- 使用busybox1.21.1制作根文件系统
1. 下载源码 https://busybox.net/downloads/ 2. 解压 3. 修改Makefile ~/busybox-1.21.1$ vi Makefile 164行: 修改前:C ...
- 【转】awk学习笔记
Awk学习笔记 整理:Jims of 肥肥世家 <jims.yang@gmail.com> Copyright © 2004 本文遵从GPL协议,欢迎转载.修改.散布. 第一次发布时间:2 ...
- 2.2.EJB_Bean
1.EJB中的三种Bean 1.会话bean(sessionbean) 负责与客户端交互.是编写业务逻辑的地方.在会话Bean中可以通过jdbc直接操作数据厍.但大多数情况下都是通过实体bean来完 ...