笔记---ES6

最新推荐文章于 2024-05-06 17:00:37 发布

小到勾嘴角

最新推荐文章于 2024-05-06 17:00:37 发布

阅读量91

点赞数

分类专栏：前端笔记文章标签： es6

本文链接：https://blog.csdn.net/weixin_42198224/article/details/115796036

版权

前端笔记专栏收录该内容

2 篇文章 0 订阅

订阅专栏

这里写目录标题

let的使用

用来声明变量，用法类似var,但是只在代码块内有用
存在块级作用域{}

不存在声明提升

console.log(a)
var a=10
console.log(b)
let b=12//not defined

不允许重复声明（包括普通变量和函数参数）

let a=10
let a=12

const的使用

声明常量
常量是不允许被重新赋值的

const a=10;
a=10//报错

解构赋值

按照一定的模式，从数组和对象中提取值，对变量啊进行赋值

//数组
let [a,b,c]=[1,2,3];
//a=1,b=2,c=3

//默认赋值
let [a=3,b]=[2];
//a=2,b=undefine
let c;
let [a=2]=[c];
//a=2,c=undefined

//对象
let {a:b}={a:111};
//b=111

let {a,b=5}={a:1}
//a=1,b=5

//ES5
var obj={"name":"fhfh";"age":20};
var name=obj.name
var age=obj.age
console.log(name+"的年龄是"+age);

//ES6
let obj={"name":"fdhfh";"age":20};
let {name,age}=obj;
consloe.log('${name}的年龄是${age}');
//注意，用反引号，不能用双引号

<body>
	<ul id="test"><ul>
	<script type="text/javscript">
	var arr=[1,2,3,4];
	let oUL=docunment.getElementByID("test");
	var html="";
	//ES5
	/*
	for (var i in arr) {
	html+="<li>"+arr[i]+"</ii>"
	}*/

    //ES6
    	for (var i in arr) {
	html+=`<li>${arr[i]}</ii>`
	}
    
	oUL.innerHTML=html;
	</script>
</body>

箭头函数

1.只含有一个表达式

//ES5
var foo =function(){
	return 1;
}
console.log(foo());

//ES6
let foo=()=>1;
console.log(foo());


let foo=(a)=>a;
console.log(foo(a));

2.含多条语句

let foo=(a)=>{
	let b=10;
	return a+b;
}
console.log(foo(a));

3.this的指向问题

//ES5
this指向window
var obj={
	"anme":"joh",
	syhello":function(){
	console.log(this.name);
}
obj.sayhello();

//ES6
this指向作用时所在的作用域，而不是执行时所在的作用域
var obj={
	"name":"dff",
	"sayhello":(）=>{
	console.log(this.anme);
}

//ES5
var obj={
"name":"john",
sayhello:function(){
	console.log(this);//john:指向定义时的作用域

	setTimeOut(()=>{console.log(this.name)},1000)
}
}
	obj.sayhello();//john


//ES6
var obj={
"name":"john",
sayhello:()=>{
	console.log(this);//john:指向定义时的作用域

	setTimeOut(()=>{console.log(this.name)},1000)
}
}
	obj.sayhello();//window

set函数

var set=new Set([1,2,2,3,4])
consloe.log（set);//Set{1,2,3,4}:去掉相同的元素

//转换成数组
//扩展运算符
var arr=[...set];
console.log(arr);//[1,2,3,4]


//输出值，而不是索引
for(let i of set){
	consloe.log(i);
}
for(let i of arr){
	console.log(i);
}
set.size
set.add(0)//添加的元素放在后面
set.delete(0)//如果没有return
set.has(0)
set.clear();//{}

keys()
for(let items of ste.keys())
{
	cosole.log(items);
	//返回键名
}
values()
for(let k of ste.values())
{
	cosole.log(items);
	//返回键名
}

entries()
for(let [items,k] of ste.entries())
{
	cosole.log(items,k);
	//返回键值对
}
set.forEach(item,key)=>console.log(item,key);

forEach():

MAP函数

var map =new Map([["name":"hh"],["age":12]]);
map.set(1,1);
map.size
map.set(key,value)
map.get(kry)
map.delete(key)
map.has(key)
map.clear()

生成器函数

function* foo(x){
	yield x+1;
	yield x+2;
	return x+3;
}
var f=foo(1);
console.log(f.next(),f.next(),f.next());//2，done:false 3,done:false 4:done:true

//next（） 参数表示上一次的返回值
function* foo(x){
var y=2*(yield(x+1));
var z=yield(y/3);
return (x+y+z);
}
var it=foo(5);
console.log(it.next(3));//x=5,yeild=5+1=6//第一行
console.log(it.next(12));//yeild=12,y=24 ,z=8;//第一行，执行到第二行
console.log(it.next(13));//yield=13,z=13,x=5,y24,z=13,5+24+13=42

用生成器写斐波拉切数列
 function* feibo(n){
 let a=0;
 let b=1;
 for(let i=0;i<n;i++)
 {
    yeild a;
 	let temp=a+b;
 	a=b;
 	b=temp;
 }
 }
var f=feibo(5);
for(let i of f){
	console.log(i);
}//0,1，1,2，3,5，8，

类（class）

class Person{
	constructor(name){
	this.name-name;}
	syhello(){
	console.log(this.name);
}
var person=new Person();//undefined:如果没传参
var person=new Person("john");//undefined:如果没传参
person.sayhello();

小到勾嘴角

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
笔记---ES6

这里写目录标题let的使用const的使用解构赋值箭头函数1.只含有一个表达式2.含多条语句3.this的指向问题set函数MAP函数生成器函数类（class）let的使用用来声明变量，用法类似var,但是只在代码块内有用存在块级作用域{}不存在声明提升console.log(a)var a=10console.log(b)let b=12//not defined不允许重复声明（包括普通变量和函数参数）let a=10let a=12const的使用声明常量常量是不允许被
复制链接

扫一扫