简介:
ES6全称ECMAScript 6,是浏览器脚本语言的一种标准,是Javascript的规格。JavaScript是ECMAScript的一种实现。
let的使用以及和var的区别
var 定义在函数外面就是全局变量,定义在函数内就是局部变量。
let 只在代码块中有效
<script>
//1 创建代码块,定义变量
{
var a = 10
let b = 20
}
//2在代码块 外面输出
console.log(a) //10
console.log(b) // not defined
function hello(){
var c=20;
console.log("in"+c); // in20
console.log("in"+a); // in10
let d=2;
}
console.log(d); // not defined
hello();
console.log("out"+c); // not defined
//var 定义在函数外面就是全局变量,定义在函数内就是局部变量。
//let 只在代码块中有效
</script>
let 只能被声明一次
<script>
var a = 1
var a = 2
let m = 10
let m = 20 //Uncaught SyntaxError: Identifier 'm' has already been declared
console.log(a)
console.log(m)
//let 只能被声明一次
</script>
const声明常量
<script>
//定义常量
const PI = "3.1415"
//常量值一旦定义,不能改变
PI = 3 //Uncaught TypeError: Assignment to constant variable.
//定义常量必须初始化
const AA //Uncaught SyntaxError: Missing initializer in const declaration
</script>
数组
<script>
//传统写法
let a=1,b=2,c=3
console.log(a, b, c)
//es6写法
let [x,y,z] = [10,20,30]
console.log(x, y, z)
</script>
对象
获取对象属性
<script>
//定义对象
let student = {"name":"tom","age":20}
//传统从对象里面获取值
let name1 = student.name
let age1 = student.age
console.log(name1+"=="+age1)
//es6获取对象值
let {name,age} = user
console.log(name+"**"+age)
//需要了解这个用法,看到后知道什么意思,我感觉这种用的少吧
</script>
定义对象
<script>
const age = 12
const name = "lucy"
//传统方式定义对象
const student = {name:name,age:age}
console.log(student)
//es6定义变量
const student= {name,age}
console.log(student)
</script>
对象复制与合并
<script>
//1 对象复制
let person1 = {"name":"lucy","age":20}
let person2 = {...person1}
console.log(person2)
//2 对象合并
let name = {name:'mary'}
let age = {age:30}
let student = {...name,...age}
console.log(student)
</script>
模板字符串
注意这里" ` "不是单引号,是~那个键上面的符号`
<script>
//1 使用`符号实现换行
let str1 = `hello,
es6 demo up!`
console.log(str1) 结果也换行了
//2 在`符号里面使用表达式获取变量值
let name = "Mike"
let age = 20
let str2 = `hello,${name},age is ${age+1}`
//console.log(str2)
//3 在`符号调用方法
function f() {
return "hello f1"
}
let str3 = `demo, ${f()}`
console.log(str3)
</script>
定义方法
<script>
//传统方式定义的方法
const person1 = {
sayhello:function(){
console.log("hello")
}
}
//调用
person1.sayHello()
//es6
const person2 = {
sayHi(){
console.log("hello")
}
}
person2.sayHello()
</script>
箭头函数
方法名=参数=>方法
<script>
//1 传统方式创建方法
var f1 = function(m) {
return m
}
console.log(f1(2))
//使用箭头函数改造 方法名=参数=方法
var f2 = m => m
// console.log(f2(8))
//2 复杂一点方法
var f3 = function(a,b) {
var c=a+b;
return c+2;
}
console.log(f3(1,2))
//箭头函数简化
var f4 = (a,b) => (c=a+b,c+2)
console.log(f4(2,2))//6
</script>
帮助到您请点赞关注收藏谢谢!!