尚硅谷ES5_6_7教程
(01. 尚硅谷_ECMAScript入门介绍&)
01. 尚硅谷_ECMAScript入门介绍&
ECMAScript理解测试
(02. 尚硅谷_ES5_严格模式&)
02. 尚硅谷_ES5_严格模式
雅阁模式禁止自定义函数中的this指向window
必须要使用var声明变量
创建eval作用域
对象不能有重名属性
01_严格模式
new时候this指向实例对象
eval定义的变量没有自己的作用域
(03. 尚硅谷_ES5_json对象扩展&)
03. 尚硅谷_ES5_json对象扩展&
02_JSON对象
(04. 尚硅谷_ES5_Object对象方法扩展&)
04. 尚硅谷_ES5_Object对象方法扩展&
原型里面的属性可以被继承
defineProperties扩展属性
03_Object扩展
对象本身两个方法回调
Title
(05. 尚硅谷_ES5_数组的扩展&)
05. 尚硅谷_ES5_数组的扩展&
prototype给实例增加属性
04_Array扩展
(06. 尚硅谷_ES5_call,apply,bind用法详解&)
06. 尚硅谷_ES5_call,apply,bind用法详解&
强制绑定this
foo.apply(obj,33) obj调用foo传递33参数,bind的this是调用的obj而不是window
05_Function扩展
(07. 尚硅谷_ES6_let const关键字&)
07. 尚硅谷_ES6_let const关键字&
不能重复声明,不存在var提升
01_let关键字测试1测试2测试3
02_const关键字
(08. 尚硅谷_ES6_变量的解构赋值&)
08. 尚硅谷_ES6_变量的解构赋值&
解构的目标是对象,只能以对象来接收,对象中可以设置属性,{}相当于全局变量usernam必须是本来对象的属性obj.xxx
只需要一部分数据
数组的解构赋值,根据下标一一对应,与写的什么没有关系
直接使用,在函数内部声明了username与age直接使用即可。
03_变量的解构赋值
(09. 尚硅谷_ES6_模板字符串&)
09. 尚硅谷_ES6_模板字符串&
04_模板字符串
(10. 尚硅谷_ES6_对象的简写方式&)
10. 尚硅谷_ES6_对象的简写方式&
如果key与value一样,可以省略一个
去掉:和function
05_简化的对象写法
(11. 尚硅谷_ES6_箭头函数详解&)
11. 尚硅谷_ES6_箭头函数详解&
只有一条语句和表达式要省略大括号,自动返回计算结果
多条语句必须return要返回结果
箭头函数所处的对象就是this
06_箭头函数测试箭头函数this_1测试箭头函数this_2
与外层函数的this一样,常规函数this谁调用它this就是谁
外面是箭头函数,此时的this就是window
本质在window下定义的箭头函数
(12. 尚硅谷_ES6_三点运算符&)
12. 尚硅谷_ES6_三点运算符&
argument是伪数组不具备数组一般属性,value可以遍历比arguments方便
少了一个占位符2
07_3点运算符
把2,3,4,5放在1,6中间
...arr不是一个数组
(13. 尚硅谷_ES6_形参默认值&)
13. 尚硅谷_ES6_形参默认值&
08_形参默认值
(14. 尚硅谷_ES6_promise对象原理详解&)
14. 尚硅谷_ES6_promise对象原理详解&
Promise是同步执行,同步阻塞,同步函数中执行异步操作
成功调用resolve(),.then()有两个回调,根据promise返回的状态执行成功的回调与失败的回调
根据状态码成功resolve返回第一个回调
11_Promise对象
get请求的参数是查询字符串req.query.id,post请求参数在请求体 req.query.body
var express = require('express'); var router = express.Router(); /* GET home page. */ router.get('/', function (req, res, next) { res.render('index', {title: 'Express'}); }); router.get('/news', function (req, res, next) { res.set('Access-Control-Allow-Origin', '*'); var id = req.query.id; console.log('/news id='+id); var news = { id: id, title: 'news title1...', content: 'news content1...', commentsUrl: '/comments?newsId='+id }; res.json(news); }); router.get('/comments', function (req, res, next) { res.set('Access-Control-Allow-Origin', '*'); console.log('/comments newsId=' + req.query.newsId); var newsId = req.query.newsId; var comments = [ { id: 1, content: 'comment content1111...', newsId : newsId }, { id: 2, content: 'comment content2222...', newsId : newsId }]; res.json(comments); }); module.exports = router;
bin/www
#!/usr/bin/env node /** * Module dependencies. */ var app = require('../app'); var debug = require('debug')('es_server:server'); var http = require('http'); /** * Get port from environment and store in Express. */ var port = normalizePort(process.env.PORT || '3000'); app.set('port', port); /** * Create HTTP server. */ var server = http.createServer(app); /** * Listen on provided port, on all network interfaces. */ server.listen(port); server.on('error', onError); server.on('listening', onListening); /** * Normalize a port into a number, string, or false. */ function normalizePort(val) { var port = parseInt(val, 10); if (isNaN(port)) { // named pipe return val; } if (port >= 0) { // port number return port; } return false; } /** * Event listener for HTTP server "error" event. */ function onError(error) { if (error.syscall !== 'listen') { throw error; } var bind = typeof port === 'string' ? 'Pipe ' + port : 'Port ' + port; // handle specific listen errors with friendly messages switch (error.code) { case 'EACCES': console.error(bind + ' requires elevated privileges'); process.exit(1); break; case 'EADDRINUSE': console.error(bind + ' is already in use'); process.exit(1); break; default: throw error; } } /** * Event listener for HTTP server "listening" event. */ function onListening() { var addr = server.address(); var bind = typeof addr === 'string' ? 'pipe ' + addr : 'port ' + addr.port; debug('Listening on ' + bind); }
可以修改为同步方式
onreadystatechange发送一次请求调用4次,有5种状态码,初始化为0,发送send为1,200和304成功状态码
获取的data是字符串,需要变为一个对象
可以继续链式调用
(16. 尚硅谷_ES6_Symbol属性介绍_01&)
16. 尚硅谷_ES6_Symbol属性介绍_01&
Symbol是原始数据类型,同一个Symbol调用属性值都是唯一值
对象实例
Symbol
(17. 尚硅谷_ES6_Symbol属性介绍_02&)
17. 尚硅谷_ES6_Symbol属性介绍_02&
Symbol不能被for in遍历出来
(18. 尚硅谷_ES6_iterator接口机制_01&)
18. 尚硅谷_ES6_iterator接口机制_01&
Iterator遍历器
arguments伪数组没有数组的一般方法可以使用for of遍历,普通对象没有interator接口
(21. 尚硅谷_ES6_Generator函数简介_01&)
21. 尚硅谷_ES6_Generator函数简介_01&
可暂停执行,生成指针对象,调用next执行内部的逻辑,普通js逻辑不会阻塞
指针执行最后返回函数的返回值,默认undefined
在哪暂停的,就在哪里启动,传入的参数就是返回值
Generator函数
返回每一个yield对应的状态
$.get返回url,保证成功调用next()又能看到url
传递url,写在getNews中的SX.next()保证了上一次请求已经成功
传递的'aaa'就是返回的url
(24. 尚硅谷_ES6_async函数详解及应用_01&)
24. 尚硅谷_ES6_async函数详解及应用_01&
以同步流程表达异步操作
遇到await不会向下执行,直到等待完异步才会继续向下执行,await接收promise,async返回值是promise对象
async函数
普通函数await返回值就是当前函数执行完毕的返回值
调用成功状态的返回值
上面的异步任务执行成功以后才会执行下面的
返回值data作为resolve的参数
一旦状态为reject失败,后面await不会继续执行
失败会返回result为false
(26. 尚硅谷_ES6_class类使用详解&)
26. 尚硅谷_ES6_class类使用详解&
constructor中的属性都会放到类的原型上
12_class
extends实现类型继承,super调用父类构造方法
(27. 尚硅谷_ES6_字符串,数组的扩展&)
27. 尚硅谷_ES6_字符串,数组的扩展
01_字符串扩展
02_数值扩展
(28. 尚硅谷_ES6_数组方法的扩展&)
28. 尚硅谷_ES6_数组方法的扩展&
form包装完毕就有数组的真方法了
03_数组扩展测试1测试2测试3
(29. 尚硅谷_ES6_对象方法的扩展&)
29. 尚硅谷_ES6_对象方法的扩展&
obj4是obj3的原型
04_对象扩展
(30. 尚硅谷_ES6_深度克隆_01&)
30. 尚硅谷_ES6_深度克隆_01&
输出wade堆栈模型
数组拷贝方法
对象的深度克隆
深拷贝
call绑定this,slice截取字符串最后一个可以使用-1
不能指向同一个内存地址,要继续遍历获取的value值
嵌套对象,result为最终克隆的数据
(32. 尚硅谷_ES6_set,map容器详解&)
32. 尚硅谷_ES6_set,map容器详解&
05_Set和Map数据结构
(33. 尚硅谷_ES6_for of用法详解&)
33. 尚硅谷_ES6_for of用法详解&
数组去重
06_for_of循环按钮1按钮2按钮3
(34. 尚硅谷_ES7_方法介绍&)
34. 尚硅谷_ES7_方法介绍&