本文系统介绍ES6新增的核心语法特性。涵盖let和const的块级作用域及暂时性死区机制,详解数组与对象的解构赋值技巧。深入解析字符串处理的includes、startsWith等新方法,以及数值判断、数组转换与查找等扩展功能,帮助开发者掌握现代JavaScript编程基础。
变量声明:let与const机制
一、let和const
let用于声明变量,其作用域严格限制在声明所在的块级作用域(即大括号{})内部。需要注意的是,let声明的变量不会像var那样发生变量提升(hoisting)。
若在一个代码块内使用了let或const,该块级作用域即被解析为封闭作用域,形成所谓的“暂时性死区”。这意味着在声明语句执行之前,变量均不可访问,必须先声明后使用。因此,只要块内存在let或const,就可能因声明顺序错误而引发引用异常。
let关键字的引入,正式为JavaScript语言补充了块级作用域的支持。
在ES6规范中,在块级作用域内声明的函数无法在外部被引用。这与ES5的行为不同,ES5允许函数声明提升至全局或函数作用域的顶部。ES6之所以做出此改变,旨在规范作用域,但为了兼容旧有代码,标准中保留了特定的例外规定。
const用于声明常量,其绑定的值在生命周期内不可被重新赋值。
当const声明的对象时,它保存的是该对象的内存地址引用,而非具体的数据内容。因此,不可变的是这个地址指向,对象内部属性仍可修改,但不可重新指向其他对象。
在全局作用域中使用let、class或const声明的变量,不再自动挂载到全局对象window上,这与var的行为有所区别。
解构赋值技巧
二、变量的解构赋值
解构赋值是一种基于模式匹配的高效赋值方式。通过左右两侧结构的对应关系,可以一次性完成多个变量的赋值,无需逐个指定。例如:
var [a, b, c] = [1, 2, 3] [这种事数组解构,按位置赋值]
此外,还支持对象解构,此时赋值顺序无关紧要,完全依据变量名进行匹配:
var {bar, foo} = {foo: “aaa”, bar: “bob”};
字符串同样支持解构,例如:const [a, b, c, d, e] = 'hello';
字符串处理扩展
三、字符串的扩展
\uxxxx表示一个字符,后接该字符的四位Unicode码点。
codePointAt方法:用于正确处理由4个字节存储的字符(如部分Emoji或生僻字)。
String.fromCharCode():用于将Unicode码点转换回对应的字符串。
for...of循环可用于遍历字符串,例如:for(let a of "hello"){console.log(a);},这将依次打印出字符串中的每个字符。
新增了类似indexOf()的判定方法:includes()用于判断是否包含指定子串;startsWith()和endsWith()分别用于判断字符串是否以指定内容开头或结尾。
repeat()方法:将原字符串复制n次并返回新字符串,例如 'x'.repeat(3) 结果为 'xxx'。
模板字符串:使用反引号(`)定义,支持多行文本和变量嵌入。
字符串中可直接使用正则表达式相关方法:match()、replace()、search()和split()。
可为正则表达式添加u修饰符,以正确处理Unicode码点大于0xFFFF的字符(如中文Emoji等)。
数值计算与判断
四、数值的扩展
二进制字面量以0b开头,八进制字面量以0o开头。
Number.isNaN()和Number.isFinite():用于严格检测一个值是否为NaN或有限数值,仅对数值类型有效。
Number.isInteger():用于判断一个数值是否为整数。
Math.trunc():用于去除数值的小数部分,返回整数部分;Math.sign():用于判断数值的符号(正数、负数或零)。
Math.cbrt():计算一个数的立方根;Math.hypot():计算所有参数平方和的平方根(即欧几里得范数)。
数组新增方法
五、数组的扩展
Array.from():将类数组对象或可迭代对象转换为真正的数组。该方法还可接收第二个参数,作用类似于map函数,用于对每个元素进行转换处理。
ES6写法:var arr = Array.from(arrayLike);
ES5兼容写法:var arr = [].slice.call(arrayLike);
Array.of():将一组值转换为数组,主要用于解决Array构造函数在参数数量不一致时的行为差异问题。
find()方法:用于查找数组中第一个满足条件的成员。其参数是一个回调函数,数组的每个成员都会执行一次该回调,直到找到第一个返回真值的元素。
[1, 5, 10, 15].find(function(value, index, arr) { //当前值、索引、原数组
return value > 9;
})
fill()方法:用于填充数组,语法为fill(value, start, end),表示从索引start开始到end结束(不含end),使用value进行填充。
ES6规定,数组中的空位(hole)在转换为数组时其值为undefined。需注意,这并非指该位置显式赋值为undefined,而是指该位置本身为空,访问时返回undefined。
以上所述是小编给大家介绍ES6新特征数字、数组、字符串,希望对大家有帮助,如果大家有任何疑问欢迎给我留言,小编会及时回复大家的。