ES6.x
类
class Animal{
constructor(name){
this.name=name
}
Spack(){
console.log(name)
}
}
class Dog extends Animal{
constructor(name,age){
super(name);//子类中如果有constructor,就必须有super
this.age=age
}
Spack(){
super.Spack()//如果没有,则重写Spack方法,有则在Spack中添加内容
console.log(age)
}
}
模块化
//导出
var name = 'Rainbow';
var age = '24';
export {name, age};
导入
import {name,age} from '来源';
箭头函数
()=>1
v=>v+1
(a,b)=>a+b
()=>{
alert("foo");
}
e=>{
if (e == 0){
return 0;
}
return 1000/e;
}
模板字符串
let name=Tom
`welcome ${name}`
解构赋值
let [foo, [[bar], baz]] = [1, [[2], 3]];
foo // 1
bar // 2
baz // 3
[x, y = 'b'] = ['a', undefined]; // x='a', y='b'
for (let [key, value] of map) {
console.log(key + " is " + value);
}
延展操作符
function sum(x, y, z) {
return x + y + z;
}
const numbers = [1, 2, 3];
console.log(sum(...numbers));
let [a,b,...c] = [1,2,3,4,5,6,7,]
console.log(a,b,c)//1 2 [3,4,5,6,7]
var arr = [1, 2, 3];
var arr2 = [...arr]; // 等同于 arr.slice()
Promise
var promise = new Promise(function(resolve, reject) {
// ... some code
if (/* 异步操作成功 */){
resolve(value);
} else {
reject(error);
}
});
promise.then(function(value) {
// success
}, function(error) {
// failure
});
promise.then((value) => {
// success
}, (error) => {
// failure
});
promise.then((value) => {
// success
}).catch((err) => {
//failure
});
Generator函数
function * gen(x){
var y = *yield* x + 2;
return y;
}
var g = gen(1);
g.next() // { value: 3, done: false }
g.next(2) // { value: 2, done: true }
async/await
*async* function process(array) {
for *await* (let i of array) {
doSomething(i);
}
}
async function process(array) {
for await (let i of array) {
doSomething(i);
}
}
正则
/foo.bar/.test('foo\nbar')// false
/foo.bar/s.test('foo\nbar') // true
let str = '2019-07-31'
let reg = /(\d{4})-(\d{2})-(\d{2})/
let reg = /(?<year>\d{4})-(?<month>\d{2})-(?<day>\d{2})/
console.log(str.match(reg).groups)
let reg = /^(?<name>welcome)-\k<name>-\1$/
let str = welcome-welcome-welcome
console.log(reg.test(str))
Proxy
let json = {
name,
age
}
let newJson = new Proxy(json,{
set(target,property,value){
if(property == 'age'){
if(!Number.isInteger(value)){
<!-- throw new TypeError('年龄是整数') -->
return false
}
}
target[property] = value
return true
},
get(target,property){
if(property in target){
console.log(`你访问了${property}属性`)
return target[property]
}else{
console.log(`没有这个属性`)
return null
}
},
has(target,key){
return key in target;
},
deleteProperty(target,property){
return true
}
})
var target = function () { return 'I am the target'; };
var handler = {
apply: function () {
return 'I am the proxy';
}
};
var p = new Proxy(target, handler);
p()
const DOM = new Proxy({},{
get(target,property){
return function(attr={},...children){
console el = document.createElement(property)
for(let key of Object.keys(attr)){
el.setAttribute(key,attr[key])
}
for(let child of children){
if(typeof child == 'string'){
child = document.createTextNode(child)
}
el.appendChild(child)
}
return el
}
}
})
let oDiv = DOM.div(
{id:'id1',class:'cl1'},'div','1123',
DOM.ul({},
DOM.li({},111)
DOM.li({},222)
DOM.li({},333)
)
)
ES6.x的更多相关文章
- ES6模块import细节
写在前面,目前浏览器对ES6的import支持还不是很好,需要用bable转译. ES6引入外部模块分两种情况: 1.导入外部的变量或函数等: import {firstName, lastName, ...
- webpack+react+redux+es6开发模式
一.预备知识 node, npm, react, redux, es6, webpack 二.学习资源 ECMAScript 6入门 React和Redux的连接react-redux Redux 入 ...
- ES6的一些常用特性
由于公司的前端业务全部基于ES6开发,于是给自己开个小灶补补ES6的一些常用特性.原来打算花两天学习ES6的,结果花了3天才勉强过了一遍阮老师的ES6标准入门(水好深,ES6没学好ES7又来了...) ...
- ES6(块级作用域)
我们都知道在javascript里是没有块级作用域的,而ES6添加了块级作用域,块级作用域能带来什么好处呢?为什么会添加这个功能呢?那就得了解ES5没有块级作用域时出现了哪些问题. ES5在没有块级作 ...
- es6小白学习笔记(一)
1.let和const命令 1.es6新增了let和const命令,与var用法类似,但它声明的变量只在let所在的代码块内有效(块级作用域,es5只有全局和函数作用域) { let a = 1; v ...
- ES6之变量常量字符串数值
ECMAScript 6 是 JavaScript 语言的最新一代标准,当前标准已于 2015 年 6 月正式发布,故又称 ECMAScript 2015. ES6对数据类型进行了一些扩展 在js中使 ...
- ES6之let命令详解
let与块级作用域 { var foo='foo'; let bar='bar'; } console.log(foo,'var'); //foo varconsole.log(bar ,'bar') ...
- ES6 箭头函数中的 this?你可能想多了(翻译)
箭头函数=>无疑是ES6中最受关注的一个新特性了,通过它可以简写 function 函数表达式,你也可以在各种提及箭头函数的地方看到这样的观点——“=> 就是一个新的 function”. ...
- ES6+ 现在就用系列(二):let 命令
系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...
- ES6+ 现在就用系列(一):为什么使用ES6+
系列目录 ES6+ 现在就用系列(一):为什么使用ES6+ ES6+ 现在就用系列(二):let 命令 ES6+ 现在就用系列(三):const 命令 ES6+ 现在就用系列(四):箭头函数 => ...
随机推荐
- A*算法在最短路问题的应用及其使用举例
1 A*算法 A*算法在人工智能中是一种典型的启发式搜索算法,启发中的估价是用估价函数表示的: 其中f(n)是节点n的估价函数,g(n)表示实际状态空间中从初始节点到n节点的实际代价,h(n)是从n到 ...
- TypeScript - 泛型
什么是泛型 官方是这样介绍的: 软件工程中,我们不仅要创建一致的定义良好的API,同时也要考虑可重用性. 组件不仅能够支持当前的数据类型,同时也能支持未来的数据类型,这在创建大型系统时为你提供了十分灵 ...
- Python爬虫实现抓取腾讯视频所有电影【实战必学】
2019-06-27 23:51:51 阅读数 407 收藏 更多 分类专栏: python爬虫 前言本文的文字及图片来源于网络,仅供学习.交流使用,不具有任何商业用途,版权归原作者所有,如有问 ...
- SQL Server导入mdf数据库文件
方法一: 1.新建查询然后输入如下代码,点击F5键或者点击运行按钮即可 EXEC sp_attach_db @dbname = '你的数据库名', @filename1 = 'mdf文件路径(包缀名) ...
- Python高级应用程序设计任务
Python高级应用程序设计任务要求 用Python实现一个面向主题的网络爬虫程序,并完成以下内容:(注:每人一题,主题内容自选,所有设计内容与源代码需提交到博客园平台) 一.主题式网络爬虫设计方案( ...
- 第三次作业-Python网络爬虫与信息提取
1.注册中国大学MOOC 2.选择北京理工大学嵩天老师的<Python网络爬虫与信息提取>MOOC课程 3.学习完成第0周至第4周的课程内容,并完成各周作业 过程. 5.写一篇不少于100 ...
- Java实现微信小程序支付(完整版)
在开发微信小程序支付的功能前,我们先熟悉下微信小程序支付的业务流程图: 不熟悉流程的建议还是仔细阅读微信官方的开发者文档. 一,准备工作 事先需要申请企业版小程序,并开通“微信支付”(即商户功能).并 ...
- 利用sklearn对多分类的每个类别进行指标评价
今天晚上,笔者接到客户的一个需要,那就是:对多分类结果的每个类别进行指标评价,也就是需要输出每个类型的精确率(precision),召回率(recall)以及F1值(F1-score). 对于 ...
- Nginx的配置文件位置以及组成部分结构讲解
场景 Ubuntu Server 16.04 LTS上怎样安装下载安装Nginx并启动: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/detai ...
- Mysql 5.7.28离线包下载与配置
下载链接:https://pan.baidu.com/s/1uPbBknyIebQRDt4k_RA58Q 提取码:14zi 将下载文件进行解压,我解压位置为:D:\Program Files\my ...