跳至主要內容
深入了解var

在ES6出现之前,我们都是使用var这个关键字来声明一个变量的,但是其弊端非常多。因此,在学习let和const之前,必须先了解一下var。var有以下两个特点。

  • 无块级作用域
  • 存在变量提升(Hoisting)

1.无块级作用域

在ES5中,作用域一般划分为全局作用域和局部作用域。其中,局部作用域也叫“函数作用域”。ES6新增了块级作用域的概念,块级作用域就是通过let或const来体现的。那么块级作用域究竟是怎样的呢?举个简单的例子,我们都知道条件语句、循环语句等是使用大括号“又”来进行代码块处理的。如果存在块级作用域,那么“B”内部定义的变量,在“0”外部是没办法访问到的;如果不存在块级作用域,那么“0”内部定义的变量,在“0”外部是可以访问得到的。对于块级作用域,用最简单的一句话来说就是,如果一门语言存在块级作用域,那么一对大括号定义的就是一个块级作用域。


GuangBo...大约 3 分钟HTMLWebES6var
本章练习

单选题

一、单选题

  1. 下面有关var、let 和const 的说法中,不正确的是()
    A. let或const声明的变量都不存在变量提升
    B. var声明的变量没有块级作用域
    C. var声明的变量也存在暂时性死区
    D. const声明的常量不允许被重新赋值
答案

分析:
C中,var不存在暂时性死区

  1. 下面有关let和const的说法中,正确的是( )
    A. 在实际开发中,优先使用let,而不是const
    B. let声明的变量,不会成为window的属性
    C. 如果const声明的变量是一个对象,那么对象属性的值是不允许被修改的
    D. 如果const声明的变量是一个对象,此时允许将另一个对象賦值给这个变量

GuangBo...大约 2 分钟HTMLWebES6习题练习题
字符串的拓展简介

ES6对内置对象(String、Array、Object等)进行了很大的改进,并且为这些内置对象增加了非常多有用的方法,大大提高了我们的开发效率。这一章先来介绍一下字符串(string)的扩展,后面的章节再详细介绍其他内置对象的扩展。ES6为宁符串新增了很多方法,其中常用的方法如表3-1所示。

字符串的新增方法

方法 说明
includes() 是否包含某个字符串
startWith() 是否以某个字符串“开头”
endWith() 是否以某个字符串“结尾”
repeat() 以某个字符串进行重复
trim() 去除首尾空格
trimStart() 去除“开头”的空格
trimEnd() 去除“结尾”的空格
padStart() 在“开头”进行填充
padEnd() 在“结尾”进行填充

GuangBo...大约 1 分钟ES6前端字符串方法
检索字符串:includes()、startWith()、endWith()

在ES5中,如果想要判断一个字符串是否包含另一个字符串,我们一般会使用indexOf0方法。ES6则为我们新增了3种更加简单的方法,如下表所示。

方法 说明
A.includes(B) 判断A是否包含B
A.startsWith(B) 判断A是否以B“开头”
A.endsWith(B) 判断A是否以B“结尾”

GuangBo...大约 2 分钟ES6前端字符串方法includesstartWithendWith
重复字符串:repeat()

在ES6中,我们可以使用repeat()方法将某 一个字符串重复多次。

语法

说明

参数n一般取正整数。虽然n也可以取0、小数等,但是我们并不建议那样做,因为这样一点意义都没有。

此外,repeat()方法会返回重复后的字符串。

示例

分析

怎么回事?不是应该输出“shanshanshanshanshanshan”吗?怎么只输出了“shanshan”呢?

这是因为repeat()并不会改变原来的字符串,因此我们需要用一个变量接收重复后的结果.
实现代码如下。

const str = 'shanshan'
const result = str.repeat(3)
console.log(result)     // shanshanshanshanshanshan

GuangBo...小于 1 分钟ES6前端字符串方法repeat()
去除空白:trim()、trimStart()、trimEnd()

在ES6中,我们可以使用trim()、trimStart()和trimEnd()这3种方法来去除字符串首尾的空空格。

语法

说明

trim()用于同时去除字符串首尾的空格,
trimStart()用于去除字符串开始处的空格,
trimEnd()用于去除字符串结尾处的空格。
此外,这3种方法最后都会返回去除空格后的字符串。


GuangBo...大约 1 分钟ES6前端字符串方法trim()trimStart()trimEnd()
长度补全:padStart()、padEnd()

在ES6中,我们可以使用padStart()和padEnd()这两个方法来实现字符串的长度补全。如果某个字符串的长度未达到指定长度,padStart()会在头部进行补全,而padEnd()会在尾部进行补全。

语法

说明

padStart()和padEnd()都有两个参数。len是必选参数,用于指定字符串的长度。str是可选参数,表示用来补全的字符串。当str省路时,表示使用空格来补全。

此外,这两种方法最后都会返回补全后的字符串。


GuangBo...大约 2 分钟ES6前端字符串方法padStart()padEnd()