zl程序教程

您现在的位置是:首页 >  后端

当前栏目

《JS原理、方法与实践》- ES6新增语法

ES6JS方法原理 实践 语法 新增
2023-09-27 14:25:58 时间

#### let 和const

var定义的变量是function级的作用域 let定义的变量属于块级作用域 而const定义的是常量 也就是定义之后不可修改

代码示例

function testVariable() {

var height 172;

const name zzh

if (height 172) {

 let height 173;

 // name zzz // 报错

}  

 

console.log(height); // 172

}

testVariable();

#### 字符串模板

自负串模板用来创建字符串的一种方式 可以在字符串中添加变量 免去了之前的使用 号拼接字符串。

语法 ${变量}

代码示例

const name zzh

const testStringTemplate Hello ${name}

console.log(testStringTemplate); // hello zzh

#### 函数参数默认值

函数参数默认值 就是给一个函数的参数提供一个默认值 当该参数没有传入时 便使用默认值。

语法 function functionName(parameter1, parameter2, ...parametern default value )

代码示例

function getPersonInfo (name, age, sex male ) {

console.log( Person info: name: ${name}, age: ${age}, sex: ${sex}

}

getPersonInfo( zzh , 18); // Person info: name: zzh, age: 18, sex: male

#### 参数扩展

参数扩展时使用三个点“...”来完成 主要有两种用法 在定义函数时将传入的多个参数封装到一个数组中 调用函数时将数组中的元素扩展为多个独立的参数。

代码示例

function mailToPerson (...names) {

for(let name of names) {

 console.log( Send to ${name}

}

}

mailToPerson( 张三 , 李四 , 王五

/*

[object Array]

Send to 张三

Send to 李四

Send to 王五

* */

// 将数组[1,3,5]展开成1 3 5三个参数后传入max方法中

console.log(Math.max(...[1,3,5])); // 5

console.log(Math.max(1,3,5)); // 5

![测试结果](https://upload-images.jianshu.io/upload_images/2789632-429d951e5fea6b51.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

#### 箭头函数

语法 参数 函数体

如果只有一个参数不需要括号 当有多个参数时 使用括号括起来 例如 (a, b) 函数体 当函数体只有一条语句需要reutrn时 不需要写关键字return 且不需要使用大括号{}阔起来 其他情况需要大括号 且需要return时 需要写return关键字。

代码示例

getName () zzh

console.log( name is: ${getName()} // name is: zzh

printInfo (name, age) {

console.log( name is: ${name}, age is: ${age}

}

printInfo( zzh , 18); // name is: zzh, age is: 18

#### for-of遍历

之前有提过for-in遍历 它可以遍历出对象的属性名。for-of遍历的结果是数组值的集合。

代码示例

var person {

name: zzh ,

age: 18,

sex: male

};

var score [98, 99, 100];

for(let p in person) {

console.log( for-in person: ${p}

}

// for(let p of person) {

//  console.log( for-of person: ${p}

// } // 报错 对象不可遍历

for(var s in score) {

console.log( for-in score: ${s}

}

for(var s of score) {

console.log( for-of score: ${s}

}

![测试结果](https://upload-images.jianshu.io/upload_images/2789632-4aa40b3526023fce.png?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)


第11/90步《番外篇》第3章 JS 语法实例讲解 第22课 今天学习《番外篇》第3章 JS 语法实例讲解 第22课 JS 实用技巧二:对象与函数等相关技巧,这节课继续学习有关变量声明、参数定义、箭头函数定义、字符串使用等有关的语法实用技巧。
第10/90步《番外篇》第3章 JS 语法实例讲解 第21课 今天学习《番外篇》第3章 JS 语法实例讲解 第21课 实用技巧一:操作符、扩展运算符和短路评估等技巧,这节课开始学习 JS 语法的简写技巧。这一课谈及的技巧,多数在前面章节中已有使用,掌握这些技巧,意在使代码更加易写、易读和易于维护。
第09/90步《番外篇》第3章 JS 语法实例讲解 第20课 今天学习《番外篇》第3章 JS 语法实例讲解 第20课 面向对象语法二:函数、类与作用域,这节课学习与函数、闭包、类和模块有关的面向对象编程基础语法。
第08/90步《番外篇》第3章 JS 语法实例讲解 第19课 今天学习《番外篇》第3章 JS 语法实例讲解 第19课 面向对象语法一:对象和数组,这节课学习对象与数组。在 JS 中,一切皆为对象,数组也是对象,数组是一种处理集合数据的特殊对象。
第07/90步《番外篇》第3章 JS 语法实例讲解 第18课 今天学习《番外篇》第3章 JS 语法实例讲解 第18课 JS 语法基础二:操作符和逻辑控制语句,这节课主要学习操作符和基本的逻辑控制语句。