1、块作用域
凡是左右花括弧包含的区域都是一个独立的作用域。该作用域里的变量只在该作用域内有效。
2、词法作用域
一个变量到底代表什么意思，要根据上下文来推断
块作用是不存在变量提升着一说的
// let username = 'zs';
// var age = 18;
//块作用域和词法作用域的区别
var flag = false
if(true){
console.log(username)
let username = 'zs'
}
//console.log(username)
3、字符串扩展
（1）编码扩展
es5只能识别\u之后四位16进制数值，多余四位则识别为两个以上字符
es6通过\u{}可识别4位以上16进制数值的字符
//1 0000000 1 ascii gbk unicode utf-8
（2）startsWith endWith两个api可以判断字符串是否以某个字符开头或结尾
4、数组扩展
var str = new Array(5).fill(0).map(()=>{return 'li'}).join('')
var obj = {
username:'zs',
count:{
math:90,
his:80
}
}
//'username' 'count.math'
function returnAttr(obj,express){
//以.为分隔符得到一个属性层级数组
let expressArr = express.split('.')
return expressArr.reduce((obj,currentAtr)=>{
return obj[currentAtr]
},obj)
}
console.log(returnAttr(obj,'count.tongji.current'))
5、Symbol
es5 ---->有几种数据类型？
基5
引1
es6 --->有几种数据类型
整数类型
Symbol:全应用唯一的值
Symbol和Symbol.for获取Symbol值得区别
let one = Symbol.for('aaa')
let two = Symbol.for('aaa')
one === two
6、Set
let first = new Set()
first.add(1)
first.add(2)
first.add(1)
//first.delete(2)
//first.clear()
//console.log(first.has(2))
for(let value of first){
console.log(value)
}
//console.log(first.keys())
7、Map
//Map 图
let first = new Map([['name','zs'],['age',18]])
//console.log(first)
first.set('count',90)
first.set('count',85)
first.delete('count')
// console.log(first.get('name'))
// console.log(first.has('name'))
// console.log(first)
for(let value of first){
console.log(value)
}
8、defineProperty
用法
Object.defineProperty(obj,key,{
....
})
| 名字 | 值 | 作用 |
|---|---|---|
| enumerable | boolean | 设置该属性是否可被遍历 |
| value | any | 该属性被访问时的返回值 |
| writeable | boolean | 该属性值是否可以被改写 |
| configurable | boolean | 该属性是否可以被重复定义 |
let obj = {
username:'zs',
age:18
}
//数据劫持configurable
Object.defineProperty(obj,'username',{
enumerable:false,
configurable:false
})
Object.defineProperty(obj,'username',{
enumerable:true
})
for(let key in obj){
console.log(key)
}
属性代理
let obj = {
username:'zs',
age:18
}
//数据劫持configurable 属性代理
let str = '666'
Object.defineProperty(obj,'username',{
get(){
return str
},
set(newValue){
console.log('设置值被触发了')
str ='bw'+newValue
}
})
obj.username = '8888'
console.log(obj.username)
不成功的属性代理
let obj = {
username:'zs',
age:18,
count:{
math:90
}
}
//封装一个函数 将obj对象的所有属性均进行属性代理
function myProxy(obj){
let keyArr = Object.keys(obj)
for(let i = 0;i < keyArr.length;i++){
let tmp;
Object.defineProperty(obj,keyArr[i],{
get(){
return tmp;
},
set(newValue){
tmp = newValue
}
})
}
}
myProxy(obj)
obj.age = 19
console.log(obj)
将一个不定层级的嵌套对象进行属性代理
let obj = {
username:'zs',
age:18,
count:{
math:90
}
}
//封装一个函数 将obj对象的所有属性均进行属性代理
function myProxy(obj){
let keyArr = Object.keys(obj)
for(let i = 0;i < keyArr.length;i++){
proxyAttr(obj,keyArr[i],obj[keyArr[i]])
}
}
function proxyAttr(obj,key,value){
if(typeof value === 'object'){
myProxy(value)
}
Object.defineProperty(obj,key,{
get(){
return value;
},
set(newValue){
if(value === newValue){
return
}
value = newValue
}
})
}
myProxy(obj)
obj.age = 19
console.log(obj)
proxy进行对象代理
let obj = {
username:'zs',
age:18,
count:{
math:90
}
}
let newObj = new Proxy(obj,{
get(target,key){
console.log('你在获取值'+key)
return target[key]
},
set(target,key,value){
target[key] = value
}
})
newObj.username = 'lisi'
console.log(newObj.count.math)
原型链
访问对象的某个属性，如果不存在，就逐层向上它的原型中查找，直到Object,次过程形成的链条就叫原型链。
将Object上的一些功能函数放到了Reflect对象上
Promise
逐行执行---->阻塞---->异步---->回调地域--->Promise
可以将回调地狱改善为then的链式调用
function ajax(fn){
setTimeout(()=>{
fn(4576)
},2000)
}
// ajax((data)=>{
// ajax((res)=>{
// console.log(res)
// })
// })
//fullfield 成功 pedding 等待 reject 错误
let first = new Promise((resolve,reject)=>{
ajax((data)=>{
resolve(data)
})
})
first
.then((res)=>{
console.log(res)
return res+1
})
.then((ress)=>{
console.log(ress)
ajax((data)=>{
console.log(data)
})
})
直接将ajax函数封装为promise
function ajax(options){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
try{
resolve(100)
}catch(err){
reject(404)
}
},2000)
})
}
ajax({
url:'',
methods:'GET'
})
.then((res)=>{
console.log(res)
return ajax({
url:'',
methods:'GET',
params:{
id:res
}
})
})
.then((pro)=>{
console.log(pro)
})
promise封装，一层then调用
const FULLFIELD = 'fulfield'
const PENDDING = 'pendding'
const REJECT = 'reject'
class MyPromise{
constructor(excute){
this.value = undefined;
this.fail = undefined;
this.state = PENDDING;
this.successContainer = [];
this.failContainer = [];
excute(this.resolve.bind(this),this.reject.bind(this))
}
resolve(data){
if(this.state===PENDDING){
this.state = FULLFIELD
this.successContainer.forEach((itemFn)=>{
this.value = data
itemFn(data)
})
}
}
reject(err){
if(this.state===PENDDING){
this.state = REJECT;
this.failContainer.forEach((itemFn)=>{
this.value = err
itemFn(err)
})
}
}
then(success,fail){
if(this.state===FULLFIELD){
success(this.value)
}else if(this.state === REJECT){
typeof fail === 'function' && fail(this.fail)
}else{
this.successContainer.push(success)
typeof fail === 'function' && this.failContainer.push(fail)
}
}
}
let first = new MyPromise((resolve,reject)=>{
setTimeout(()=>{
resolve(100)
},2000)
})
first
.then((res)=>{
console.log(res)
})
generator函数的声明和使用
//generator
function *test(){
console.log('666')
yield 1+100
yield 2
return 100
}
//generator函数调用拿到的是一个执行器
let first = test()
console.log(first.next())
console.log(first.next())
console.log(first.next())
console.log(first.next())
generator函数解决异步流程控制
let first;
function add(){
console.log('generator函数开启执行')
setTimeout(()=>{
first.next(300)
},2000)
}
function login(verify){
setTimeout(()=>{
first.next('true'+verify)
},2000)
}
//generator
function *test(){
let a = yield add()//验证码请求
console.log(a,'---')
let status = yield login(a)//登录请求
console.log(status)
return 100
}
//generator函数调用拿到的是一个执行器
first = test()
first.next()
Promise.resolve,Promise.reject
Promise.resolve(new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(100)
},1000)
})).then((res)=>{
console.log(res)
})
Promise.resolve(6).then((res)=>{
console.log(res)
})
Promise.reject(6).then(()=>{},(err)=>{
console.log(err)
})
Promise.all
function fetch1(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
reject(6)
},2000)
})
}
function fetch2(){
return new Promise((resolve,reject)=>{
resolve(7)
})
}
Promise.all([fetch1(),fetch2()]).then((res)=>{
console.log(res)
},(err)=>{
console.log('异常'+err)
})
Promise.race
function fetch1(){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(6)
},2000)
})
}
function fetch2(){
return new Promise((resolve,reject)=>{
resolve(7)
})
}
Promise.race([fetch1(),fetch2()]).then((res)=>{
console.log(res)
},(err)=>{
console.log('异常'+err)
})
async await
function testFn(num){
return new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve(num)
},2000)
})
}
async function test(){
let result = await testFn(100);
let res = await testFn(result+1);
console.log(res)
return 666
}
test()
栈
class MyStack{
constructor(){
this.container = []
}
add(value){
this.container.push(value)
//console.log(this.container)
}
pop(){
return this.container.pop()
}
peak(){
//console.log(this.container[this.container.length-1],'容器')
return this.container[this.container.length-1]
//this.container[(this.container.length-1<0)?0:(this.container.length-1)]
}
size(){
return this.container.length
}
}
let first = new MyStack()
let str = '{(){[}}'
/*
'[()]{(){[]}}'
*/
let standardObj = {
"}":"{",
")":"(",
"]":"["
}
for(let i = 0;i < str.length;i++){
if(str[i]==="{"||str[i]==="("||str[i]==="["){
first.add(str[i])
}else{
if(standardObj[str[i]]===first.peak()){
first.pop()
}else{
first.add(str[i])
}
}
}
console.log(first,first.size())
