ES6类的使用和定义.Json.Promise对象的使用
ECMAScript 6-第三讲
本章目标:
掌握es6中class类的声明
掌握类的继承
Json的新的应用
Promise对象的方法
本章内容:
Class类的声明:
所谓的java的面向对象和这个很相似,但是在js其实是基于对象的,所谓的基于对象就是一直在用对象而不是,而不是完全使用面向对象的思想,面向对象我们都知道是封装,继承,多态,而基于对象,其实就是在使用对象。对象比数组强的地方在于他有属性和方法。所以在js中很少使用类这个方式。但是在es6中提供了这样一种声明方式
<script>
//我们使用以前的方式声明,是以构造函数的方式声明的类的属性
function Person(name,age) {
this.name = name;
this.age = age;
}
//然后再给这个类加一个方法
Person.prototype.say = function () {
console.log("我的名字是"+this.name+"今年"+this.age);
}
//然后声明一个变量来充当对象
var p = new Person("wyh",30);
p.say();
</script>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
我们看到以前是用js写的这种声明对象的方式很怪异,很不方便,那么再ES6中,给我们提供了类的声明方式,我们改造一下刚才的例子
那我们看到这个新增的class的声明方式和我们使用java书写的时候是不是区别就不大了。
接下来我们就以可以看一下类的另一种特性
Class的继承:
//我们在原有的基础上,来看一下ES6 的继承
class Teacher extends Person{
constructor(name,age,school){
super(name,age);
this.school = school;
}
study(){
console.log(this.name+"="+this.age+"="+this.school);
}
}
let t = new Teacher(“张三丰”,30,“AAA软件”);
t.say();
t.study();
JSON的新应用:
JSON对象:
JSON.stringify() 串行化
JSON.parse() 反串行化
简写:
- (属性和值)名字一样可以简写
- 方法一样可以简写(:function省)
JSON 的标准写法: - 只能用双引号(“”);
- 所有的(属性)名字只能用双引号(“”)包起来;
<script>
//promise这个对象们主要是用来解决像是异步操作中回调地狱这样的情况
//那么我们先做一个回调函数
function demo(fun) {
//我们使用&&判断一下,这个是由短路功能的
//如果前面成功就执行后面,如果前面不成功就不执行后面
setTimeout(()=>{
fun && fun();
},1000)
}
//那么我们在调用demo这个函数的时候需要传递一个函数
demo(()=>{
console.log(1);
})
</script>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
那么如果说我们遇到很多层的调用,这时候不光是代码不优雅,还不容易理解层次关系,我们改进一下这个代码看看效果
这时候我们看到他是每间隔1秒到用一次,那么我们可以像是写同步一样的去写这种代码么?
我们先来认识一下promise这个对象
Promise:
抽象表达:promise是js进行异步编程的新的解决方案
具体表达:
从语法上来说:promise是一个构造函数
从功能上来说:promise对象用来封装一个异步操作对象并可以捕获其结果
状态的特点
Promise 异步操作有三种状态:pending(进行中)、fulfilled(已成功)和 rejected(已失败)。除了异步操作的结果,任何其他操作都无法改变这个状态。
Promise 对象只有:从 pending 变为 fulfilled 和从 pending 变为 rejected 的状态改变。只要处于 fulfilled 和 rejected ,状态就不会再变了即 resolved(已定型)。
状态的缺点
无法取消 Promise ,一旦新建它就会立即执行,无法中途取消。
如果不设置回调函数,Promise 内部抛出的错误,不会反应到外部。
当处于 pending 状态时,无法得知目前进展到哪一个阶段(刚刚开始还是即将完成)。
Promise的执行流程
then 方法
then 方法接收两个函数作为参数,第一个参数是 Promise 执行成功时的回调,第二个参数是 Promise 执行失败时的回调,两个函数只会有一个被调用。
接下来我们使用新的方式改写一下刚才的调用的方式
//我们使用新的方式来写一下
function foo() {
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve();
},1000)
})
}
foo().then(()=>{
console.log(“a”);
return foo();
}).then(()=>{
console.log(“b”);
return foo();
}).then(()=>{
console.log(“c”);
return foo();
})
Promise中的方法
Catch()
首先介绍一下promise的catch(),这个方法就像是try–catch语句块一样,是输出异常的
我们发现这时候他就会把异常输出
All()
接下来我们来介绍一下promise的all()
新的promise的例子入门
<script>
let p = new Promise((resolve, reject) => {
//执行异步任务
setTimeout(()=>{
const time = Date.now();
//如果当前时间是偶数就代表成功,否则代表失败
if(time %2 ==0){
//如果成功,调用resolve(value)
resolve('成功的数据'+time)
}else{
// 如果失败调用rejrct(reason)
reject('失败的数据'+time)
}
},1000)
})
p.then(
value =>{
//接受到成功的数据
console.log("成功回调",value);
},reason =>{
//接受到失败的数据
console.log("失败的回调",reason);
}
)
</script>
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
文章来源: aaaedu.blog.csdn.net,作者:tea_year,版权归原作者所有,如需转载,请联系作者。
原文链接:aaaedu.blog.csdn.net/article/details/114604861
- 点赞
- 收藏
- 关注作者
评论(0)