ES6(3-22)

let

1.不允许重复声明

2.let可以每一次都生成一个新的值

for(Let i=0;i<oli.length;i++{
oli[i].onclick =function(){
console.log(i)
}

3.暂存性死区

在这里插入图片描述
let应该放在console的上面

4.不与顶层对象挂钩

const

1.常量
一开始必须要给他值
2.不能重复定义
3.块级
在块外无法访问
4.声明不提升

改变const值

1.将其定义为对象的形式

变量解构赋值

在这里插入图片描述
在这里插入图片描述
可以直接获取到其中的值
在这里插入图片描述
可以获取到前三个字母

模板字符串

特殊:支持表达式例如三目运算符

Let arr =["tiechui","kerwin","gangdan"]
Let newlist = arr.map(function(item,index)
return `<li class="${index===0?'active':''}">
<b>${item}</b>
</li>`
console.log(newlist)
Let oul = document.querySelector("ul")
oul.innerHTML = newlist.join("")

字符串扩展与数值扩展

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

数组拓展

在这里插入图片描述
在这里插入图片描述
array.of区别:
array如果只有一个值会被人为空
而.of可以使其中一个值为那个数
flat:

let arr = [1,2,3,[4,5,6]]
let arr1 = arr.flat()
console.log(arr,arr1)

对象拓展

1.key值域变量相同时可以省略

Let name= "moduleA"
Let obj=name, //name:name
test1(){
}test2(){

2.对象属性:表达式

Let name=a
Let obj = {
[name+"bc"]:"kerwin'
console.log(obj)

可以实现key的拼接
3.扩展运算符…

let obj1 ={
name:"kerwin"
// let obj1={
…obj
//
//}
Let obj2 = {
age:100
// obj1.name = "tiechui"I
console.log({…obj1,…obj2})

4.object.assgin
合并:
第一个元素为目标,第二三个往第一个元素合并

Let obj1=name:"kerwin"}
let obj2 ={
age:100}
let obj3 ={
name:"tiechui"
}
console.log(0bject.assign(obj1,obj2,obj3))

5.object.is
可以用来判断NaN是否相等

console.log(Object.is(parseInt("kerwin"NalN));

也可以用来判断正0和负0是否相等

函数的扩展

1.参数默认值后面的可以再改盖掉前面的

//1-参数默认值
function ajax(url,method="get",async=true){
console.log(url,method,async)
ajax("/aaa","get",true)
ajax("/bbb")
ajax("/ccc","post")

2.rest函数(剩余参数)

function test(x,y,…data){
console.log(data)
}
test(1,2,3,4,5,6)  //此时test就是剩余参数

3.name属性
例如test.name,可以获取他的name属性
4.箭头函数可以简洁

1.//箭头函数:写法简洁
Let test = ()=>"1111111111111"
console.log(test())
Let arr = ["aaa","bbb","ccc"]
Let newarr = arr.map((item)=><li>${item}</li> )
console.log(newarr)
//1只有return 可以省略
//2.如果返回对象需要注意加上括号表明是一个整体
Let test2 = ()=>({
name:"kerwin",
age:100
}
//3.如果只有一个参数,
可以省略()
Let arr = ["aaa","bbb","ccc"]
Let newarr = arr.map(item=>'<li>${item}</li>)
Let newarr2 = arr.map((item,index)=> <li>${item}-${index}</li>)
console.log(newarr,newarr2)
//4.无法访问arguments,无法new
Let test3 =()=>{
// console.log(arguments)
}
// test3(1,2,3,4)

在这里插入图片描述
可以通过新建一个that来存储this
或者使用箭头函数,因为他没有this,所以指向的是父域的

Symbol(表示独一无二的值)

在这里插入图片描述

//1.不能进行运算
// console.log(s1>"aaaaa")
// 2.显示调用toString()
console.log(s1.toString()+"aaaa")
//3.隐式转换boolean
iF(s1){
console.log("执行"

Iterator迭代器

在这里插入图片描述

Iterator 的遍历过程:1)创建一个指针对象,指向当前数据结构的起始位置。也就是说,遍历器对象本质上,就是一个指针对象。
(2)第一次调用指针对象的next方法,可以将指针指向数据结构的第一个成员。
(3)第二次调用指针对象的next方法,指针就指向数据结构的第二个成员。
(4)不断调用指针对象的next方法,直到它指向数据结构的结束位置。

set

在这里插入图片描述

//set实例属性和方法
console.log(s1.size)
//add
s1.add(5).add(6)
console.log(s1)
// has
console.log(s1.has(5))
// delete
s1.delete(5)
console.log(s1.has(5))

在这里插入图片描述

Map数据结构

在这里插入图片描述
在这里插入图片描述

Proxy代理

在这里插入图片描述
注意使用proxy要改变this指向

Reflect

Reflect 可以用于获取目标对象的行为,它与Object类似,但是更易读,为操作对象提供了一种更优雅的方
式。它的方法与 Proxy是对应的。

//1.代替object 某些方法
Let obj ={
Reflect.defineProperty(obj,"name",{
value:"kerwin",
writable:false,
enumerable:false
})
console.log(obj)
//2修改某些object方法返回结果
// 老写法
try {
object.defineproperty(target, property, attributes);
success
} catch (e) {
// fail
}
//新写法
if (Reflect.defineProperty(target, property, attributes)){
// success
} else {
// fail
}
//老写法
delete obj.name
∥/新写法
Reflect.deleteProperty(obj,"name")

Promise对象

在这里插入图片描述

Let pro = new Promise(function(resolve,Ireject){
//执行器函数
setTimeout(()=>{
resolve(1000)
{
},1000)
}// pro.then(()=>{
console.log("奖金"//
//},()=>{
console.log("没有"//
//})
pro.then(()=>{
console.log("奖金"}).catch(()=>{
console.log("没有"}

在这里插入图片描述
在这里插入图片描述

//.then.then链式调用
Let pro = new Promise(function(resolve,reject){/执行器函数
setTimeout(()=>{
resolve(1000)
// reject("no 1111")
},1000)
})
pro.then((res)=>E
console.log("奖金1",res)
//如果return非promise类型,pending-fulfilled
}).then((res)=>{
console.log("奖金2",res)
}).catch((err)=>{
console.log("没有",err)
}

Generator

在这里插入图片描述

function ajax(url){
return new Promise((resolve,reject)=>{
Let xhr new XMLHttpRequest()
xhr.open("get",url,true)
xhr.send()
xhr.onreadystatechange function(){
if(xhr.readyState 4){
if(xhr.status>-200&8xhr.status<300){
resolve(JSON.parse(xhr.responseText))
}else{
reject(xhr.responseText)
}
})

function *gen(){
Let res = yield ajax("1.json")
console.log("第一个请求的结果",res)
Let res2 = yield ajax("2.json",res)
console.log(res2)
}
Let g = gen()
//手动版本
// console.log()
g.next().value.then(data=>{
// console.log(data)
g.next(data)
}//自动版本
function AutoRun(gen) {
Let g = gen();
function next(data){
Let res =g.next(data);
if (res.done) return
res.value.then(function (data) {
next(data);
});

class语法

class Person {
static myname="person类的名字"
static mymethod = function(){
// console.log("mythod",this.age)
}

constructor(name,age){
this.name = name
this.age =age
}
say(){
console.log(this.name,this.age)
}
//类的方法
Let s=Symbol('say')
class Person {
constructor(name,age){
this.name
name
this.age age
[s](){
console.log(this.name,this.age)
}
}
Let obj = new Person("kerwin",100)
console.log(obj.__proto__===Person.prototype)

Moudle模块化语法

1.type =modle无法有效果无法放代码
导入的方法:
import A1 from‘./1.js’

import {A1,A2} from './1.js'

在这里插入图片描述

NodeJs的模块化

const obj1 = require("./1.js")
const obj2 = require("./2.js")


exports.B1=B1
exports.B2=B2
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值