一、块级作用域
1. var
起首看看ES5中得变量声明体式格局
if (true) {
var a = 2
}
console.log(a) // 2
以上代码等同于
var a
if (true) {
a = 2
}
console.log(a)
以上可知 :
- 在块内部定义变量 变量提拔,到函数最顶部
- 经由过程var声明的变量,不论在那边声明,均为全局作用域
2.let 和 const
再来看看ES6
中的let
和const
let
if (true) {
let b = 2
}
console.log(b) // b is not defined
此时在{} 外部接见b 将会报错,由于 let 的作用域仅为
{ }
的内部,及
块级作用域
const
if (true) {
const c = 2
}
console.log(c) // c is not defined
从上面可知 const 也是也仅为块级作用域
const的作用域与let作用域雷同:只在声明地点的块级作用域内有效
让我们看看const 更多的特征:
const 示意常量:
const d = 2
d = 3 // Assignment to constant variable.
此时,当 d 为
基础数据范例的时刻,转变其值,将会报错!!!
然则它的常量仅仅示意的是地点常量 对象的成员能够转变值
看看下面的例子:
const people = {name: '张三', age: 23}
people.age = 25
console.log(people) // {name: "张三", age: 25}
看看此时 people
已被转变了
why?
对象是庞杂的数据范例 它的地点保存在 栈内里, 值保存在堆内里
cosnt仅仅是保证这个地点不转变,至于地点对应的数据,是能够举行转变的
基础范例值在内存中占有牢固大小的空间 因而被保存在栈内存中。比方 const a = 1 ; 这时刻其直接保存在栈内里
二、字符串
1. 字符串拼接
ES5中字符串拼接
// ES5
var name = 'Hunter'
console.log('hello ' + name)
ES6中字符串拼接
// ES6
let name = 'Hunter'
console.log(`hello ${name}`) // hello Hunter
注重:用 ${}
来拼接字符串,注重此时要运用
` `(反单引号); 以下所示: 单引号将没法将其转义
console.log('hello ${name}') // hello ${name}
ES6的字符串换行
// ES5
var template = "<div> \
<span>hello world</span> \
</div>"
// ES6
let template2 = `<div>
<span>hello world</span>
</div>`
ES5中需要用反斜杠来举行多行字符串拼接,ES6直接运用
` `(反单引号)
2. 字符串要领
padStart() 和 padEnd()
ES6 引入了字符串补全长度的功用,假如某个字符串不够指定长度,会在头部或许尾部补全。
padStart()
用于头部补全;
padEnd()
用于尾部补全。
以下一个例子:例子泉源
setInterval(() => {
const now = new Date()
const hours = now.getHours().toString()
const minutes = now.getMinutes().toString()
const seconds = now.getSeconds().toString()
console.log(`${hours.padStart(2, 0)}:${minutes.padStart(2, 0)}:${seconds.padStart(2, 0)}`)
}, 1000)
先不论箭头函数
看看个中的hours.padStart(2,0)
, 示意当小时不够两位数时,在前面补0,如8
,补充成 08
背面碰到更多的字符串函数会补充
三、变量的解构赋值
// ES5
let a = 1;
let b = 2;
let c = 3;
1.ES6数组解构赋值
let [a,b,c] = [1,2,3];
console.log(`${a} ${b} ${c}`) // 1 2 3
默认值
let [d = 2, e] = [undefined, 3];
console.log(`${d} ${e}`) // 2 3
当赋值为
undefined
时取默认值 当赋值为其他的有效值或许
null
时 取所赋值的值
let [f = 2, g = 3] = [null, 4];
console.log(`${f} ${g}`) // null 4
2.对象解构赋值
数组根据递次解构 对象根据key值举行解构
let {foo, bar} = {foo: 'hi', bar: 'hello'} //能够换取位置
console.log(`${foo} ${bar}`) *// hi hello
注重:先定义再解构需要在解构语句那块加上圆括号
let soso;
// { soso } = { soso: "hi"}; // 毛病
({ soso } = { soso: "hi"}); //得加上圆括号 ()
console.log(soso) // hi
3.字符串的解构赋值
const [h,i,j,k,l] = 'hello';
console.log(`${h} ${i} ${j} ${k} ${l}`)