《JS原理、方法与实践》- ES6新增语法
#### 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 语法基础二:操作符和逻辑控制语句,这节课主要学习操作符和基本的逻辑控制语句。
相关文章
- ES6(十)Symbol
- ES6 - const命令
- ES6教程-字符串,函数的参数,了解函数的arguments对象,js面向对象,设计模式-单例模式,解构赋值
- es6 不能使用 null 作为默认参数的解决方式
- Babel安装在本地并用webstrom由ES6转Es5
- es6(2)——let和const
- es6中export和export default的区别
- ES6+ Math 对象的扩展
- ES6+ Number 对象的方法
- JS ES6 模块化开发入门
- es6语法
- ES6语法中--let和const 的区别
- js版本规范的表示:ES6 == ES 6 == ECMAScript 6 == ECMA-262 6
- 让 Node.js 支持 ES6 的语法
- webpack5用babel-loader将es6的js代码转换成es5
- [js高手之路] es6系列教程 - 迭代器与生成器详解
- [js高手之路] es6系列教程 - Map详解以及常用api
- [js高手之路] es6系列教程 - Set详解与抽奖程序应用实战
- [js高手之路] es6系列教程 - promise常见用法详解(resolve,reject,catch,then,all,race)
- [js高手之路] es6系列教程 - 解构详解
- VUE 爬坑之旅 -- 用 ES6 语法写一个工具类,并全局引用