atbubls(Jason Liao)

a little boy picking up shells


  • 首页

  • 标签

  • 分类

  • 归档

  • 公益404

自己手搓的一些vue组件轮子

发表于 2018-05-09 | 分类于 vue

a JasonLiao project: jsl-vue-h5

自己纯手工打造的一些轮子,一个vue的H5插件库, 按照375px宽度的UI图构建, 会转换为vw, 可按需引入,welcome npm install and happy hacking ~☺️

npm site: https://www.npmjs.com/package/jsl-vue-h5

demo online: https://atbulbs.github.io/jsl-vue-h5-demo-online/

code demo: https://github.com/atbulbs/jsl-vue-h5-demo

¶install

1
$ npm install jsl-vue-h5 --save

¶import and use it

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
// main.js
import {
JslAvatar,
JslBtnScalableJump,
JslButton,
JslClose,
JslGrid,
JslGridItem,
JslLoading,
JslNavBar,
JslNomoreTip,
JslToast
} from 'jsl-vue-h5'
import 'jsl-vue-h5/dist/jsl-vue-h5.min.css'

Vue.use(JslAvatar)
Vue.use(JslBtnScalableJump)
Vue.use(JslButton)
Vue.use(JslClose)
Vue.use(JslGrid)
Vue.use(JslGridItem)
Vue.use(JslLoading)
Vue.use(JslNavBar)
Vue.use(JslNomoreTip)
Vue.use(JslToast)

// jsl-loading-demo.vue
<template>
<div class="root">
<jsl-loading />
</div>
</template>

¶documentation

¶jsl-toast

1
this.$jsl.toast(text, position, duaration)
阅读全文 »

浅谈http

发表于 2018-05-08 | 分类于 http

¶网络协议分层(经典五层模型)

经典五层模型

  1. 应用层(http, 只有请求和响应, 没有连接, tcp提供连接)
  2. 传输层(tcp/udp提供端对端的服务, 分包和组装, 一个tcp里可以有多个http)
  3. 网络层(寻找网络设备的逻辑)
  4. 数据链路层(电路的连接)
  5. 物理层(硬件设备)
阅读全文 »

解读MDN的bind的polyfill

发表于 2018-05-08 | 分类于 JavaScript

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/bind#Polyfill

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
if (!Function.prototype.bind) {
Function.prototype.bind = function(oThis) {
// 如果给函数对象的属性而不是方法来调用bind
// 如:
// fn = function () {}
// fn.test = {}
// fn.test.bind(this)
// 则抛出异常
if (typeof this !== 'function') {
// closest thing possible to the ECMAScript 5
// internal IsCallable function
throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
}

var aArgs = Array.prototype.slice.call(arguments, 1),
// 待绑定的函数
fToBind = this,
// 中间构造函数
fNOP = function() {},
// bind返回的函数
fBound = function() {
// 用new去调用bind返回的函数, 之前绑定的oThis会失效
return fToBind.apply(this instanceof fNOP
? this
: oThis,
aArgs.concat(Array.prototype.slice.call(arguments)));
};

// 如果待绑定的函数有原型对象, 考虑Function.prototype没有原型对象
if (this.prototype) {
// typeof Function.prototype === 'function'
// Function.prototype doesn't have a prototype property
// 让中间构造函数的原型对象为待绑定函数的原型对象
fNOP.prototype = this.prototype;
}
// bind返回的函数的原型对象为中间构造函数的一个实例中间空对象
fBound.prototype = new fNOP();

return fBound;
};
}

webpack3.0升级4.0爬坑记

发表于 2018-03-28 | 分类于 前端工程

老司机🚕, 等等我!

¶webpack官方2018年2月25日发布了4.0.0版本

阅读全文 »

字符串操作

发表于 2018-03-15 | 分类于 JavaScript

¶substring

       类似数组的slice, 但不能传入负的参数

1
2
3
4
5
6

// 电话号码加密
function secureTel (num) {
const str = num + ''
return str.substring(0, 3) + '****' + str.substring(7, 11)
}

你的webpack,是你的webpack

发表于 2018-03-12 | 分类于 前端工程

前言

同学,你平时用vue-cli构建你的vue项目么,你有研究过vue-cli生成的目录结构和文件里的代码么,你是否看到webpack的官方文档然后从入门到放弃呢,让我们用对新人更友好的姿势学习webpack,进阶webpack配置工程师😂,定制属于你自己的webpack吧😎,happy hacking!😄
ps:如果你是在手机上浏览,横屏体验更好哦~

阅读全文 »

正则的风骚操作

发表于 2018-03-05 | 分类于 JavaScript

¶个位数字字符数组去重

1
2
3
4
5
6
7
8
9
function noRepeatReg (arr) {
return arr.sort().join('').replace(/(\d)\1*/g, '$1').split('')
}

const arr = ['0', '2', '3', '2', '3', '1', '1']

const res = noRepeatReg(arr)

console.log(res)

¶单词尾部追加

阅读全文 »

就是干

发表于 2018-03-04 | 分类于 前端学习

¶to learn

  • flutter
  • python
  • DS AI
  • webgl
  • vue源码通读到熟悉
  • 函数式编程
  • 深究ES6
  • 设计模式理论与实践
  • 数据结构与算法理论与实践
  • http理论与实践
  • 前端性能优化细则
  • Java语法
  • Python语法
  • 汇编
  • C
  • C++
  • 编译原理

¶by

  • 慕课网
  • 书
  • leet code
  • 博客总结

¶to write on blog

  • express gerator
  • pm2
  • 性能优化
  • webpack原理
  • w3c标准制定流程
  • 实现promise
  • 实现bind
  • 函数防抖与函数截流
  • 深究const
  • phaser在iOS 8, 9 的兼容
  • requestAnimationFrame的用法
  • game适配方案

阮一峰老师的时间管理的七句话

发表于 2018-03-04 | 分类于 个人提升

time1

阅读全文 »

前端开发, 从入门到入门

发表于 2018-03-03 | 分类于 前端学习

先上一些大神们熬的汤, 值得认真读值得深思

以下划横线的链接信息量很大,请点击链接耐心阅读,你一定会很有收获的

¶阮一峰的博文

🔗 穷忙的人生: 感觉就是在说之前瞎JB折腾的我😂
🔗 技术教育的兴起: 未来只有两种途径可以改变人生,另一种是购买彩票,一种是学习技术

¶郝建培的博文

🔗 我前妻的故事: 一个初中肄业生的奋斗: 从洗头小妹到360技术专家的华丽丽的蜕变
🔗 技术总监Sycx的故事: 一个有志青年靠技术逆袭的故事

¶Scott老师的故事

🔗 4 年前端狗,2 年 CTO: 零基础转行, 从前端小白到阿里前端大牛的打怪练级刷装备之旅

只要思想不滑坡, 办法总比困难多

阅读全文 »
1…345
atbulbs

atbulbs

41 日志
19 分类
27 标签
GitHub E-Mail
© 2019 atbulbs