ES6 简单语法:

  变量声明

    ES5 var 声明变量为全局变量 会变量提升
    ES6 let 声明的变量为块级变量 且不能重复声明 不存在变量提升 # {}一个大括号为一个作用域
    ES6 const 声明一个只读的常量,一旦声明,常量的值就不能改变,且一旦声明必须立即初始化

  解构赋值(解包)

例如:
  数组
let [a,b,c] = [1,2,3]
a = 1
b = 2
c = 3

  默认赋值
let[a=3,b] = [2]
a=2
b=undifind

 
let c
let [a=2] = [c]
a = 2   对象
    

    let {a,b} = {a:"111",b:"222"}
      a=111
      b=222

    let {a:b} = {a:111}
      a=111
      b=111

    let {a,b=5} = {a:1}
      a=1
      b=5

 

  强转字符串

     ['内容'+xxx] # 中括号中的内容会被强转为str类型 如果为数组则转化为类似json格式的内容 可以实现字符串的拼接

  模板字符串:

    # 模板字符串,都是用反引号表示。如果在模板字符串中需要使用反引号,则前面要用反斜杠转义。
    # 如果使用模板字符串表示多行字符串,所有的空格和缩进都会被保留在输出之中。
    用 `包裹字符串${变量}`

  

  箭头函数:

    ES6允许使用“箭头”(=>)定义函数

    var f = a => a 等价于 var f = function(a){return a}

//无形参
var f = () => 5;
// 等同于
var f = function () { return 5 }; //多个形参
var sum = (num1, num2) => num1 + num2;
// 等同于
var sum = function(num1, num2) {
return num1 + num2;
};

# 补充this

  es5普通函数 this指向的是调用者
  箭头函数 this指向调用者所在的父类

***使用箭头函数需要注意的几点

  1.函数体内的this对象,就是定义时所在的对象,而不是使用时所在的对象;

# 例如 vue中
created(){
function(){console.log(this)} # 此处this指向的是window对象
} created(){()=>{console.log(this)}} # 此处this指向的是vue对象

  2.不可以使用arguments对象,该对象在函数体内不存在。如果要用,可以用 rest 参数代替。

对象的单体模式:

  # 用于解决箭头函数 this使用定义对象而不是当前所在对象
  fav(){} 等价于 fav:function(){} # this 为当前函数的this

自执行函数:

  (function(){})(); # 自执行的this 是window

面向对象

  JavaScript 语言中,生成实例对象的传统方法是通过构造函数

function Animal(name,age){ # 首字母大写表名声明类
this.name = name;
this.age = age;
}
Animal.prototype.showName = function(){ # 添加类方法 相当于继承所有Animal类都有showName方法
console.log(this.name);
console.log(this.age);
}
var a = new Animal('小黄',5); # new方法创建类对象
a.showName()

es6 创建类的方法

class Classname{
  constructor(name,age){ # 相当于python中初始化 __init__方法
    this.name = name;
    this.age = age
  }
  classdef(){}
 }

调用:
var xxx = new Classname()
xxx.classdef()

 

es6 生成器

function* xxx(){  // function* 创建生成器函数
yiled xxx
yiled xxx
return xxx
}

获取值
var f = xxx
f.next() # 如果next传参表示上一次yiled的值

set结构

  let set = new Set([1,2,3,4,4,]) //构造函数,值不重复 相当于set集合

扩展运算符

  [...set] # 将set打散成列表

for循环

  for (let i of set){console.log(i)} # 循环

set属性

  set.size #长度
  set.add('xxx') 增
  set.delete('xxx') 删
  set.has('xxx') 查
  set.clear('xxx') 清空
  set.entries 枚举

ES6简单语法的更多相关文章

  1. 10.1 ES6 的新增特性以及简单语法

    ES6 的新增特性以及简单语法  let 和 const 模板字符串 箭头函数 对象单体模式 es6面向对象 模块化  let 和 const 之前一直用 var 来声明变量,ES6 新增 let 和 ...

  2. ES6常用语法

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...

  3. vue(2)—— vue简单语法运用,常用指令集

    按照前面的文章:vue(1)——node.js安装使用,利用npm安装vue  安装完vue之后,就可以使用vue了 vue vue简介 前面安装好vue之后,确实还没有对vue进行介绍,首先,官网: ...

  4. ES6最新语法

    ECMAScript 6(以下简称ES6)是JavaScript语言的下一代标准.因为当前版本的ES6是在2015年发布的,所以又称ECMAScript 2015. 也就是说,ES6就是ES2015. ...

  5. ES6新语法之let关键字;有别于传统关键字var的使用

    ES6新语法于2015年发布:而我这个前端小白在17年才接触到.惭愧惭愧!!不过到目前为止,似乎只有FireFox和Chrome对ES6的支持相对良好.不过既然人家ES6已经出来了,还是要跟上技术的潮 ...

  6. Vue(1)- es6的语法、vue的基本语法、vue应用示例,vue基础语法

    一.es6的语法 1.let与var的区别 ES6 新增了let命令,用来声明变量.它的用法类似于var(ES5),但是所声明的变量,只在let命令所在的代码块内有效.如下代码: { let a = ...

  7. ES6常用语法简介import export

    ES6常用语法简介import export let与var用法区别 //var var a = []; for (var i = 0; i < 10; i++) { a[i] = functi ...

  8. es6基本语法,vue基本语法

    一.es6基本语法 0.es6参考网站 http://es6.ruanyifeng.com/#README 1.let 和 const (1)const特点: 只在局部作用域起作用 不存在变量提升 不 ...

  9. ES5与ES6常用语法教程之 ②解构语法糖、声明变量异同

    js常用语法系列教程如下 es5与es6常用语法教程(1) es5与es6常用语法教程(2) es5与es6常用语法教程(3) es5与es6常用语法教程(4) es5与es6常用语法教程(5) es ...

随机推荐

  1. EAC3 mantissa quantization(VQ & GAQ)

    EAC3基于hebap来决定mantissa的quantizer. hebap如下: mantissa 使用VQ(vector quantization) 和GAQ(gain adaptive qua ...

  2. 做新时代的奋斗者!(好吧,我还没弄出python的编译环境)

    Pictures: 今日分来的补记来嘞: Game 1:Guess the number. Python包含许多内建的函数,有些函数存在于称为模块的单独的程序中,可以使用import语句把它们的模块导 ...

  3. 当用命令导入csv文件时提示错误[Err] 1290 - The MySQL server is running with the --secure-file-priv option so it cannot execute this statement

        安装之后没有my.ini配置文件怎么办,因为自己安装的是zip压缩版的mysql,所以再5.7之后就没有my.ini配置文件,所以有时候需要去自己创建一个叫my.ini的配置文件,但是特别 要 ...

  4. 微信小程序 scroll-view 左右横向滑动没有效果(无法滑动)问题

    小程序组件 scroll-view 中分别有上下竖向滑动和左右横向滑动之分,在这次项目中刚好需要用到横向滑动,但在测试过程中发现横向滑动没有了效果(静止在那里没移动过),经调试发现: 1.scroll ...

  5. Flask 教程 第十八章:Heroku上的部署

    本文翻译自The Flask Mega-Tutorial Part XVIII: Deployment on Heroku 这是Flask Mega-Tutorial系列的第十八部分,我将在其中部署M ...

  6. opencv:图像梯度

    常见的图像梯度算子: 一阶导数算子: #include <opencv2/opencv.hpp> #include <iostream> using namespace cv; ...

  7. bugku 宽带信息泄露

    首先下载文件 下载完成后发现是一个后缀名为 bin 的文件 然后找百度查一下这是什么文件的后缀名 看一下题目 然后用软件routerpassview打开(搜的教程) 然后打开文件 搜索username ...

  8. 1.学习一下Angularjs的promisee

    1.首先来了解一下promisee: 在谈论Promise之前我们要了解一下一些额外的知识:我们知道JavaScript语言的执行环境是“单线程”,所谓单线程,就是一次只能够执行一个任务,如果有多个任 ...

  9. 大数据的特征(4V+1O)

    数据量大(Volume):第一个特征是数据量大,包括采集.存储和计算的量都非常大.大数据的起始计量单位至少是P(1000个T).E(100万个T)或Z(10亿个T). 类型繁多(Variety):第二 ...

  10. Python常用数据类型转换

    常用的数据类型转换 目标 了解类型转换的作用 掌握常用的类型转换 函数 说明 int(x [,base ]) 将x转换为一个整数 long(x [,base ]) 将x转换为一个长整数 float(x ...