ES6基础语法

最新推荐文章于 2024-06-11 18:58:36 发布

@前端攻城狮

最新推荐文章于 2024-06-11 18:58:36 发布

阅读量427

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/qq_49633562/article/details/115446686

版权

1、块作用域构造let和const

let声明

使用let声明的变量的作用域限制在当前代码块中：

//函数内部
function changeState(flag) {
   
    if(flag){
   
        let color = "red";
    }
    else{
   
        console.log(color); //此处不能访问color(color is not defined)
        return null;
    }
}

//块中
{
   
    let a=1;
}
console.log("a =" + a); //此处报错：a is not defined

//for循环中
for(let i=0; i < 10; i++){
   }
console.log("i = " + i); //报错：i is not defined

不能使用 let 在同一作用域下声明已经声明过的变量：

var index = 0;
var index = 10;
let index = 100; //Identifier 'index' has already been declared

var a = 0;
{
   
    let a = 10; //OK
}

const声明

const用于声明常量，在声明的同时必须初始化：

const num = 10; //OK

//错误
const a;
a = 10;

在同一作用域下用 const 声明已经存在的标识符会导致语法错误，无论该标识符是使用var还是let声明。

使用 const 声明的对象，其本身的绑定不能修改，但对象的属性和值是可以修改的：

const person = {
   
    name: "zhangsan"
};

person.name = "lisi"; //OK
person.age = 20; //OK

//错误，Assignment to constant variable.
person = {
   
    name: "wang"
};

全局块作用域绑定

在全局作用域中使用var声明的变量或对象，将作为浏览器环境中的window对象的属性，这意味着var很可能会覆盖一个已存在的全局属性。例如:

<head>
	<script>
		var greeting = "Welcome";
		console.log(window.greeting); //Welcome
		console.log(window.Screen); //function Screen() { [native code] }
		var Screen = "liquid crystal";
		console.log(window.Screen); //liquid crystal
	</script>
</head>

如果在全局作用域下使用 let 或 const ，则不会成为window对象的属性。如下：

<script>
	let greeting = "Welcome";
	console.log(window.greeting); //undefined
	const Screen = "something";
	console.log(Screen === window.Screen); //false
</script>

2、模板字面量

多行字符串

模板字面量的基础语法就是用反引号（`）来替换字符串的单、双引号。例如：

let message = `Hello World`;

这时变量的值与普通的字符串并无差异。
使用模板字面量语法，可以很方便实现多行字符串的创建。如果需要在字符串中添加新行，直接换行即可：

let msg = `Hello
World`;
console.log(msg);

输出结果：

Hello
World

在反引号中的所有空白字符（包括但不限于空格、换行、制表符）都属于字符串的一部分。

字符串占位符

在模板字面量中，可以将变量或JS表达式嵌入占位符中作为字符串的一部分输出。
占位符语法为${…}，花括号中间可包含变量或表达式：

let name = "zhangsan";
let msg = `Hello, ${
      name } `;
console.log(msg); //Hello,zhangsan

let amout = 5;
let price = 6;
let total = `The total price is ${
      price * amout }`;
console.log(total); //The total price is 30

模板字面量本身也是JS表达式，因此可在一个模板字面量中嵌入另一个模板字面量。如：

let name

最低0.47元/天解锁文章

@前端攻城狮

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
打赏
0
评论
ES6基础语法

ECMAScript 6语法简介1、块作用域构造let和constlet声明const声明全局块作用域绑定2、模板字面量多行字符串字符串占位符3、默认参数4、rest参数5、展开运算符6、对象字面量语法扩展属性初始值的简写对象方法的简写语法可计算的属性名7、解构赋值对象解构1、块作用域构造let和constlet声明使用let声明的变量的作用域限制在当前代码块中：//函数内部function changeState(flag) { if(flag){ let color =
复制链接

扫一扫