一些基础的ES6 语法
<script>
window.onload = function () {
//---------------------------let-----------------------------------
//ES5
//var name = 'zach';
//while (true) {
// var name = 'obama';
// console.log(name);
// break;
//}
//console.log(name);
//ES6 学习篇之let(使用场景 当需要使用到块级作用域的时候使用let 来修饰变量而在ES5中只有全局作用域和函数作用域)
//let name2 ='zach';
//while(true){
// let name2='obama';
// console.log(name)
// break
//}
//console.log(name2)
//引用场景之二
//var b=[];
//for (var i = 0; i < 10; i++) {
// b[i]=function(){
// console.log(i);
// }
//}
//b[6]();
//es6 语法
//var a=[];
//for (let i = 0; i < 10; i++) {
// a[i]=function(){
// console.log(i);
// }
//}
//a[6]();
//ES5
//var clickBox=document.querySelectorAll(".clickbox");
//for (var i = 0; i < clickBox.length; i++) {
// clickBox[i].onclick=function(){
// console.log(i);
// }
//}
//ES6
//var clickBox=document.querySelectorAll(".clickbox");
//for (let i = 0; i < clickBox.length; i++) {
// clickBox[i].onclick=function(){
// console.log(i);
// }
//}
//-------------------------------const------------------------------
//也用来声明变量,但是声明的是常量。一旦声明,常量的值就不能改变。
//const PI =Math.PI;
//PI=15
//-------------------------------------class- extends -super()---------------------------------
//class Person {
// constructor(){
// this.type='person'
// }
// says(say){
// console.log(this.type+"says"+say);
// }
//}
//let person =new Person();
//person.says("hello");
//Class之间可以通过extends关键字实现继承
//super关键字,它指代父类的实例(即父类的this对象)。
//子类必须在constructor方法中调用super方法,否则新建实例时会报错。
//这是因为子类没有自己的this对象,而是继承父类的this对象,然后对其进行加工。
//如果不调用super方法,子类就得不到this对象。
//class Student extends Person{
// constructor(){
// super();
// this.type = 'cat'
// } //}
//let student=new Student();
//student.says("hello"); //语法糖 匿名函数的写法
setTimeout(function (i){
return i+;
},);
var i=;
//(i) => i + 1 注意这里不要加分号
setTimeout ((i) => i + ,); //setTimeout ((i) => console.log(i + 1),1000);
//当我们使用箭头函数时,函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象。
//class Person {
// constructor(){
// this.type='ren'
// }
// says(say){
// setTimeout(()=>{console.log(this.type+"says"+say)},1000)
// }
//}
//var person=new Person();
//person.says('hi');
//----------------------template string---占位string--------------------------
// var basket={};
// basket.count=1;
// basket.onSale='hello';
// //这里用的是反引号` esc 下面那个键
// $("#result").append(`
//There are <b>${basket.count}</b> items
// in your basket, <em>${basket.onSale}</em>
// are on sale!`);
//------------------------destructuring----------------------
//let cat ='ken';
//let dog= 'lili';
//let zoo={cat:cat,dog:dog};
//console.log(zoo);
//ES6
//let cat ='ken';
//let dog='lili';
//let zoo={cat,dog};
//console.log(zoo); //let dog ={type:'animal',many:2}
//let {type,many}=dog
//console.log(type,many)
//---------------------------------default, rest-------------------
//给函数赋值默认参数
function animal(type = 'cat'){
console.log(type)
}
animal();
}
</script>
一些基础的ES6 语法的更多相关文章
- 把JavaScript代码改成ES6语法不完全指南
目录 * 核心例子 * 修改成静态变量(const)或块级变量(let) * 开始修改 * 疑问解释(重复定义会发生什么) * 疑问解释(let的块级作用域是怎样的) * 疑问解释(const定义的变 ...
- Vue基础之es6
什么是ECMAScript,以及es6的诞生? 1997年 ECMAScript 1.0 诞生 1999年12月 ECMAScript 3.0诞生,它 是一个巨大的成功,在业界得到了广泛的支持,它奠定 ...
- Vue基础(ES6)
起步 1.扎实的HTML/CSS/Javascript基本功,这是前置条件. 2.不要用任何的构建项目工具,只用最简单的<script>,把教程里的例子模仿一遍,理解用法.不推荐上来就 ...
- ES6语法知识
let/const(常用) let,const用于声明变量,用来替代老语法的var关键字,与var不同的是,let/const会创建一个块级作用域(通俗讲就是一个花括号内是一个新的作用域) 这里外部的 ...
- 在Node中使用ES6语法
Node本身已经支持部分ES6语法,但是import export,以及async await(Node 8 已经支持)等一些语法,我们还是无法使用.为了能使用这些新特性,我们就需要使用babel把E ...
- WebStorm ES6 语法支持设置
ECMAScript 6是JavaScript语言的下一代标准,已经在2015年6月正式发布了.Mozilla公司将在这个标准的基础上,推出JavaScript 2.0.ES6的目标,是使得JavaS ...
- WebStorm ES6 语法支持设置和ES6语法的JS文件编译为ES5语法文件
ECMAScript 6是JavaScript语言的下一代标准,已经在2015年6月正式发布了.Mozilla公司将在这个标准的基础上,推出JavaScript 2.0.ES6的目标,是使得JavaS ...
- es6语法重构react代码
1.使用React.Component创建组件,需要通过在constructor中调用super()将props传递给React.Component.另外react 0.13之后props必须是不可变 ...
- vue 2.0 无法编译ES6语法
# vue2.0 webpack 无法编译 ES6 语法 之前在使用 vue 1.x 时用 vue-loader@8.0.0 版本可以正常打包vue的代码,包括ES6语法也能正常转为ES5语法,但是当 ...
随机推荐
- 来到园子的第two天!!!!!
经过这几天的打字练习 从练习的第一天到今天(应该是第三天吧) 从67到133字/分钟,我练的是英文文章测试,总的来说挺不容易 ,感觉后几天提升就不好提了呀 不说废话了 简单说一下今天的收获吧 都是 ...
- 001-supervisor
supervisor 使用教程(转) 原文地址:https://word.gw1770df.cc/2016-08-04/linux/supervisor-%E4%BD%BF%E7%94%A8%E6%9 ...
- Linux知识点拾遗-磁盘UUID
查看磁盘UUID 方法1 ls -l /dev/disk/by-uuid example: [root@dplinux ~]# ll /dev/disk/by-uuid/ total 0 lrwxrw ...
- 自定义指令 限制input 的输入位数
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...
- 获取sender进程所产生的trace文件
直接开启数据库实例级别的sql_trace是不现实的,会对所有连接到oracle的session都产生sql_trace,这样会产生大量的trace文件(垃圾文件),因此为跟踪特定进程的sql信息,可 ...
- Python---进阶---文件操作---搜索文件和保存搜索结果
### 编写一个程序,用户输入文件名以及开始搜索的路径,搜索该文件是否存在,如果遇到文件夹,则进入该文件夹继续搜索 - input 去接受用户输入的文件名和开始搜索的路径 - os.path.isdi ...
- 计算两个GPS坐标的距离
场景:已知两个GPS点的经纬度坐标信息.计算两点的距离. 1. 距离/纬度关系 GPS: 22.514519,113.380301 GPS: 22.511962,113.380301 距离: 284. ...
- 前向渲染使用重叠Reflection Capture 造成的反射通道接缝问题
问题出现的条件: 使用UE4 4.16 使用Forward shading 使用多个Sphere Reflection Capture组件(有重叠的部分) 烘焙灯光后能看到明显的反射通道接缝 解决办法 ...
- 170814-17关于javaweb的知识点
1. 静态web项目.动态web项目区别 WEB-INF ...
- Python List 列表list()方法
Python基础数据类型之一列表list,在python中作用很强在,列表List可以包含不同类型的数据对像,同时它是一个有序的变量集合,每个变量可以存储一个地址.所有序列能用到的标准操作方法,列表也 ...