es6的一些知识点

前言:es6(ECMAscript2015)标准

let、const、var的一些区别
  • let、const 块级作用域、全局作用域、函数作用域
  • var 全局作用域、函数作用域
变量提升的问题:
var : true
let、const : false

例子:

console.log(a);//undefind
let a=1;

块级作用域:例如在一个函数,for循环。。。区块之内!

const 常量,值不可更改。

let、var 变量,值可以更改

严格模式
  • 消除Javascript语法的一些不合理、不严谨之处,减少一些怪异行为;

  • 消除代码运行的一些不安全之处,保证代码运行的安全;

  • 提高编译器效率,增加运行速度;

  • 为未来新版本的Javascript做好铺垫。

"严格模式"体现了Javascript更合理、更安全、更严谨的发展方向,包括IE 10在内的主流浏览器,都已经支持它,许多大项目已经开始全面拥抱它。

“use strict”
模板字符串(Template Strings)
  • 规定了一种新的string方法可用 `` 斜引号来创建字符串的代码块
  • 绑定变量用${}来绑定。
let name="xiaosan";
let age=22;
let home="china"
let str1=`she's name ${name},
she age ${age},
she homes's ${home}`
alert(str1)
  • 字符串内可直接换行
let str1=`she's name ${name},
she age ${age},
she homes's ${home}`
alert(str1)
  • 标签模板字符串。
function tag(strings,...args){    //...扩展运算符
//console.log(strings);
//console.log(args);
let str='';
for(var i=0,l=strings.length-1;i<l;i++){
str=str+strings[i]+args[i];
}
str+=strings[l];
return str
}
let name1="xiaomi";
let age1=23;
let str3=tag`
she's nam1 ${name1}
she age ${age1}
`
console.log(str3)
增强的对象字面量(自变量)
  • 对象属性能够简写;
  • 对象方法可以简写function关键字
let name="张三";
let age=22;
let zhangshan={
name,
age,
runing(){
console.log("我会跑")
}
}
  • 对象属性名可以书写自动计算形式
  • 原型继承__proto__
 let people={
eat(){
console.log("我会吃")
},
speak(){
console.log("我会说话")
},
feeling(){
console.log("我有感情")
}
}
let caowei={
name:name,
__proto__:people,//设置对象原型,用来继承
study(){
console.log("I have sutying ok!")
}
}
console.log("my name's"+caowei.name)
caowei.study();
caowei.eat();
caowei.speak();
caowei.feeling();
console.log(caowei)
解构赋值
  • es6允许我们按照一定结构提取数组与对象里的值,赋给变量
  • 函数的解构赋值
  • 说的明白一点解构赋值它的类型就是数组跟对象

    例子
//数组
let [a,,c]=[1,2,3];
console.log(a,c)
//对象
let obj={
x:1,
y:2
}
let {x,y}=obj
console.log(x,y)//1 2
//函数操作
//函数传对象 function fn(person){
let name=person.name;
let age =person.age;
console.log(name,age)
}
let aa={name:"xiaosan",age:18}
fn(aa)*/
/* function fn({uname:name,age,sex="女人"}){
console.log(name,age,sex)
}
let bb={uname:"xiaosan",age:18}
fn(bb)*/
//es5 函数传数组
/*function fn(Arr){
let x=Arr[0];
let y=Arr[1];
let z=Arr[2];
console.log(x,y,z)
}*/
/*function fn([x,y,z,d=22]){ console.log(x,y,z,d)
}
let arr=[9,5,8]
fn(arr)
//字符串解构赋值 let str="123456";
let [a,b,c,d,e,f,g=50]=str;
console.log(a,b,c,d,e,f,g)

这就是es6的一些简单认知,未完待续...

es6的一些知识点的更多相关文章

  1. ES6/ES2015常用知识点和概念

    越来越多的开源库开始使用ES2015来构建代码了,大家知道ES6=ES2015,ES6在2015年被ECMAScript标准化组织approve,各大浏览器厂商要完全支持ES6的强大功能还须一些时日, ...

  2. ES6之主要知识点(十)Proxy

    Proxy 用于修改某些操作的默认行为,等同于在语言层面做出修改,所以属于一种“元编程”(meta programming),即对编程语言进行编程. Proxy 可以理解成,在目标对象之前架设一层“拦 ...

  3. ES6之主要知识点(九)Set和Map

    1.Set ES6 提供了新的数据结构 Set.它类似于数组,但是成员的值都是唯一的,没有重复的值. Set 本身是一个构造函数,用来生成 Set 数据结构. const s = new Set(); ...

  4. ES6之主要知识点(八)Symbol

    防止属性名的冲突.这就是 ES6 引入Symbol的原因. 它是 JavaScript 语言的第七种数据类型,前六种是:undefined.null.布尔值(Boolean).字符串(String). ...

  5. ES6之主要知识点(七)对象

    1.属性的简洁表示法 ES6 允许直接写入变量和函数,作为对象的属性和方法.这样的书写更加简洁. function f(x, y) { return {x, y}; } // 等同于 function ...

  6. ES6之主要知识点(六)数组

    引自http://es6.ruanyifeng.com/#docs/array 1.扩展运算符(...) 扩展运算符(spread)是三个点(...).它好比 rest 参数的逆运算,将一个数组转为用 ...

  7. ES6之主要知识点(五)函数

    函数参数的默认值 作用域 ; function f(x, y = x) { console.log(y); } f() let x = ; function f(y = x) { let x = ; ...

  8. ES6之主要知识点(四)数值

    引自:http://es6.ruanyifeng.com/#docs/number 1.Number.isFinite(),Number.isNaN() Number.isFinite(); // t ...

  9. ES6之主要知识点(三)字符串

    引自:http://es6.ruanyifeng.com/#docs/string#codePointAt codePointAt() String.fromCodePoint() at() incl ...

随机推荐

  1. 1.Java 加解密技术系列之 BASE64

    Java 加解密技术系列之 BASE64 序号 背景 正文 总结 序 这段时间,工作中 用到了 Java 的加解密技术,本着学习的态度,打算从这篇文章开始,详细的研究一番 Java 在加解密技术上有什 ...

  2. 开涛spring3(6.9) - 对JDBC的支持 之 7.1 概述

    7.1  概述 7.1.1  JDBC回顾 传统应用程序开发中,进行JDBC编程是相当痛苦的,如下所示: //cn.javass.spring.chapter7. TraditionalJdbcTes ...

  3. JS 一条原型链扯到底

    在正文之前,首先要知道两点, 1.__proto__是每个js 对象的内置属性,而prototype 是函数的内置属性,也是一个对象. 2.所谓原型,指的就是每个函数对象的prototype属性. f ...

  4. REDIS安装与配置

    1. mkdir /home/redis/ 2. mkdir /home/redis/conf 3. mkdir /home/redis/data 4. cd /home 5. 下载redis版本3. ...

  5. (数字IC)低功耗设计入门(五)——RTL级低功耗设计(续)

    二.RTL级低功耗设计(续) 前面一篇博文我记录了操作数隔离等低功耗设计,这里就主要介绍一下使用门控时钟进行低功耗设计. (4)门控时钟 门控时钟在我的第一篇博客中有简单的描述,这里就进行比较详细的描 ...

  6. python之路 序列化 pickle,json

    运行代码,毫不留情地得到一个TypeError: Traceback (most recent call last): ... TypeError: <__main__.Student obje ...

  7. 从零开始理解JAVA事件处理机制(1)

    “事件”这个词已经被滥用了.正因为“事件”的被滥用,很多人在用到事件的时候不求甚解,依样画葫芦,导致学习工作了很多年,还是不清楚什么是事件处理器.什么是事件持有者.所以,如果你对于Event这个词还是 ...

  8. textarea placeholder文字换行

    要实现这样的效果 第一反应是直接在placeholder属性值里输入\n换行,如: <textarea rows="5" cols="50" placeh ...

  9. Mybatis中如何查询时间段内的数据

    最后一个是正确的,前边的三个是可能遇到的坑,给大家展示一下,如果不需要的,可以直接跳到最后看: 有时候我们需要查询一张表内一段时间内操作的数据,大家很容易就想到了 between ? and ? 这个 ...

  10. 脑洞大开--一条项目中常用的linux命令引发的经典算法题

    小时候家里定了<读者>的月刊,里面记录一个故事:说有有个偏僻的乡村一日突然来了一个美女,她携着万贯家财子女在当地安家落户,成了当地的乡绅.她让她的子女世世代代的保守这个秘密,直到这个秘密不 ...