H5、C3及ES6新增特性。

4 篇文章 0 订阅
2 篇文章 0 订阅

H5新标签:
headerfooternavarticlesectiondatalistinput里定义list=iddatalist定义id),asidefieldset(加legend标签),video(ogg,mp4,webm),audio(ogg,mp3,wav)。
canvasmenufigure
inputtype值:
emailtelurlnumbersearchrange(滑块),timedatedatetimemonthweek
新属性:
placeholderautofocus,multiple(可多选文件),autocomplete(必须加Name值),required(必填项),accesskey(加一个键盘字母定光标)。
H5删除标签:
frame,center,big,b,font。

CSS3新特性。
animationtransitiontransform
圆角:border-radius添加圆角边框。
阴影:box-shadowinset内阴影。
渐变:线性(bgm-gradient(linear,左上到右上));径向(bgm-gradient(radial,圆到圆))
盒子模型:box-sizing:content-boxborder-box。webkit兼容。

ES6常用新特性。

let定义局部对象,const定义常量,原先var可以重复声明且无法限制修改,且是函数级变量。
② 函数参数扩展(a,b,...args)...还可以展开数组:...arr2let a = [...b,...c];合并数组。
③箭头操作符用于简化函数的写法,操作符左边为参数,右边为具体操作和返回值。可以直接调用父级this。箭头函数的this永远指向windows。
④ 结构赋值:左右结构必须一致,声明和赋值let b =[a,b,c] = [12,5,8];
⑤数组新增方法:map,reduce,filter,forEach
Ⅰ,map:映射,一个对一个。
Ⅱ,reduce,汇总,一堆出一个。
arr.reducet((tmp,item,index)=>{ //tmp为前面相加的结果 return tmp + item; })
Ⅲ,filter,过滤器。
arr.filter(item=>{ //返回false的项不显示 return item%3==0 });
Ⅳ,forEach,迭代。
arr.forEach((item,index)=>{//相当于for循环})
⑥字符串模板:``,连接非常方便,你懂的,Json的值必须用双引号,key必须加双引号。
⑦延展操作符:通过它可以将数组作为参数直接传入函数:
⑧为了统一集合类型,ES6标准引入了新的iterable类型,Array、Map和Set都属于iterable类型,具有iterable类型的集合可以通过新的for … of循环来遍历。

ES6面向对象概念
① 新增类class User{},可定义构造函数,方法无需用function,直接clickBtn(){}
②继承extends,使用:class VipUser extends User{},在构造器中执行父类super()

class VipUser extends User{
	constructor(name,pass,level){ //...args
		super(name,pass); //...args
		this.level=level;
}}

异步:可同时进行多个操作;同步:同时只能做一件事。
Promise:用同步方式,写异步代码,定义及使用:

function createPromise(url){
return new Promise(resolve,reject){
//异步代码,resolve成功,reject失败。
	$ajax({
	url:url,
		success(arr){
		resolve(arr)
	 }})
}}
Promise.all([
	createPromise('data/arr.txt'),
	createPromise('data/arr.txt'),
]).then(function(arr){
//成功
},function(arr){
//失败
})

进一步简化:

Promise.all([
	$.ajax({url:url,dataType:'json'}),
	$.ajax({url:url,dataType:'json'})
]).then(function(result){
	let [arr,json] = result; //此处arr和jsobn分别来自上面ajax的结果
	//成功
	},function(arr){
	//失败
})

generator生成器:
①可以让函数在运行过程中停止。
function *show(){ yield ajax(xxx) },yield暂停,*表明函数是生成器。
③走走停停,自行操控,let genObj = show(); 继续:genObj.next();
④yield可传参可返回,第二个next给yield传参,传前面的参数用show(n,m),最后的next可获取show函数return 的值。

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值