不定时总结ES6里面的怪姿势!
1·变量
let url = _rural, method = `post`, loading = true, data = { page,page_size, rd_session}, params = { url, method, loading, data};
tips:在{}中写个变量名,默认为对象!
2·函数
page({
…Ani.methods,
})
tips: …Ani.methods 代表的方法相当于引入以下函数方法
/* 核心事件 */ center(x, y,d, o, p){
let duration = 3000, timingFunction = ‘linear‘, ani = `{"${p}":""}`;
let animation = wx.createAnimation({
duration, timingFunction
}); return new Promise(() => {
animation.translate(x, y).opacity(o).rotate(d).step();
ani = JSON.parse(ani);
ani[p] = animation.export(); this.setData({ani})
})
}, /* 制造随机数值 */ random(id, p) { // 转化 成 rpx 值 即 1rpx
let rpx = 1/wx.getSystemInfoSync().windowWidth*750;
let x = Math.round(Math.random() * rpx * 300), y = Math.round(Math.random() * rpx * 300); // 随机角度的产生
let deg = this.randomdeg(-180, 180); // 获取 目标 view 宽高等值
wx.createSelectorQuery().select( `#` + id).boundingClientRect( function(r) {
let w = parseInt( r.width * rpx ); if( w + x > 375 && y > 750) this.random(id); this.center(x, y, deg, 1, p);
}.bind(this)).exec();
}, /* 制造随机角度 */ randomdeg(minDeg, maxDeg){ // tips: 角度取值范围[-π, π] 即 [-180, 180],在此范围内的随机数
switch(arguments.length){ case 1: return parseInt(Math.random()*minDeg+1,10); break; case 2: return parseInt(Math.random()*(maxDeg-minDeg+1)+minDeg,10); break; default: return 0; break;
}
}, /* 动画循环效果 系列 函数 */ MoveInterval(id, n, p) { // 清除 计时器
clearInterval(this.data.timer); // 动画初始
setTimeout(() => { this.random(id,p);
},0)
let num = !n ? this.data.num : n; // 制造 计时器
this.data.timer = setInterval( () => {
num--; if(num > 0){ this.random(id,p);
}else{
clearInterval(this.data.timer);
}
}, 3000)
}
3·ES6 里面的 map
r.lists.map( item => {
item.latitude \= item.lat;
item.longitude \= item.lng;
item.iconPath \= \`/images/location\_icon.png\`;
item.width \= 40;
item.height \= 40;
markers.push(item);
});
tips:item.XXX 相当于给数组对象添加新元素
4·ES6 获取数组多个对象中多个键值对
r.lists.map( item => {
item.latitude \= item.lat;
item.longitude \= item.lng;
item.iconPath \= \`/images/location\_icon.png\`;
item.width \= 40;
item.height \= 40; return { /\* 你所选择的键 比如 id ,name 等 \*/}
});
5·ES6 … 的妙用
r.lists.map( item => {
item.latitude \= item.lat;
item.longitude \= item.lng;
item.iconPath \= \`/images/location\_icon.png\`;
item.width \= 40;
item.height \= 40; return {...item};
});
6·箭头函数 比较常用
fetch(parmas).then( r => {
console.log(\`map:\`,r);
let scenic\_list \= r.lists, {markers} = this.data;
r.lists.map( item \=> {
item.latitude \= item.lat;
item.longitude \= item.lng;
item.iconPath \= \`/images/location\_icon.png\`;
item.width \= 40;
item.height \= 40;
markers.push(item);
});
tips:fetch 是我封装的请求函数,里面有箭头函数就直接复制了
7·object 合并
let obj = {…data.list1, …data.list2};
8·反单引号
wx.showLoading({
title: `正在上传:${i}/${arr.length}`
});
…有新发现了在补充,如果 客观 有不同想法,留下你笔墨!
手机扫一扫
移动阅读更方便
你可能感兴趣的文章