一些基础的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语法,但是当 ...
随机推荐
- Centos6.6安装apache2.4
安装apr请参考: http://www.cnblogs.com/yuzhaokai0523/p/4382974.html 1安装httpd-2.4.10.tar.gz wget http://w ...
- Codeforces Round #427 (Div. 2) - C
题目链接:http://codeforces.com/contest/835/problem/C 题意:在二维坐标里,有n个星星,m个询问,星星的最大亮度c.然后输入n个星星的坐标和初始亮度,对于每个 ...
- bzoj4530 [Bjoi2014]大融合 子树信息 LCT
题目传送门 https://lydsy.com/JudgeOnline/problem.php?id=4530/ 题解 想要求出一条边的负载那么就是要求出一个点为根的时候的另一个点的子树大小. 又因为 ...
- Django【第9篇】:Django之用户认证auth模块
用户认证--------------auth模块 一.auth模块 from django.contrib import auth 1 .authenticate() :验证用户输入的用户名和密码 ...
- eclipse安装心得和环境变量配置的体会
从昨天开始就开始安装eclipse,一开始觉得安装eclipse很简单,肯定就跟下个游戏差不多,但是打开官网之后发现下载的安装包不能用,经过搜索之后发现是因为下载源不对.改过下载源之后下载的安装包竟然 ...
- [洛谷P4823] TJOI2013 拯救小矮人
问题描述 一群小矮人掉进了一个很深的陷阱里,由于太矮爬不上来,于是他们决定搭一个人梯.即:一个小矮人站在另一小矮人的 肩膀上,知道最顶端的小矮人伸直胳膊可以碰到陷阱口. 对于每一个小矮人,我们知道他从 ...
- springboot创建拦截器
一.创建一个MyIntercepor实现HandlerInterceptor接口的类 二.创建一个WebMvcConfig实现WebMvcConfigurer的类 ...
- css3 中的2D转换
一.CSS3转换 通过转换实现对对元素进行旋转.缩放.移动.拉伸的效果:这种原来必须要通过JS或者图片处理才可以实现的效果,现在都可以通过CSS3来完成. 2D转换采用transform属性来实现效果 ...
- Nginx与Lua开发
1.Lua及基础语法 Nginx与Lua环境 场景:用Nginx结合Lua实现代码的灰度发布 1.Lua 是一个简洁.轻量.可扩展的脚本语言 2.Nginx+Lua优势 充分的结合Nginx的并发处理 ...
- python之assert
作用 assert用来验证一个表达式是否正确,如果正确则程序向下执行,如果错误则报错,其中报错信息可以自定义. 例子 表达式没有错误的情况 >>> assert mul(2, 3) ...