imax1

博客全新升级!使用更简单,功能更强大!

- 发表于 2018-12-03 · 最后访问 9小时前 -

博主今年秋招找完工作后对此博客进行了一次较大的升级,去掉了一些不太实用的功能,加强了现有功能,重构了部分代码,提高规范性和扩展性,看到这半年时间陆陆续续积累了100多个star,博主也是有了更下去的动力,也感谢大家的关注,相信这个博客会越来越好用的哈哈😄下面是最新版的介绍:前台:极简风格制作,注重移动端显示,只使用了最基础的 bootstrap,加载速度快:文章浏览:浏览量统计,标签功能文章搜索:支持标题、标签搜索文章评论:支持评论与回复,邮件提醒后台:使用 React + Ant Design :文章管理:支持置顶、公开/隐藏文章...

imax1

JavaScript中使用正则表达式

- 发表于 2018-07-27 · 最后访问 5小时前 -

可以用正则的方法:search() 找到匹配的第一个字符串,返回位置match() 提取匹配的字符串,返回子串replace() 替换全部匹配的字符串RegExp.test()使用1:var re = new RegExp('a', 'i');使用2:var re = /a/i;数字:\d英文数字下划线:\w空白字符:\s除了数字: \D除了英文数字下划线:\W除了空白字符:\S任意:.出现n次:{n}出现n-m次:{n,m}出现最少n次:{n,}若干个:+出现0或1次:?出现0或多次:*或者:|方括号:[abc], [a-z0-9], [^a-z](^除了...)忽略大小写:i全局匹配:g行首:^行尾:$-----

imax1

按值传递和引用传递

- 发表于 2018-07-26 · 最后访问 1小时前 -

在JavaScript中,基础类型变量是按值传递的,对象类型变量是引用传递的var a;var b=a;a=3;console.log('b=', b);// b= undefined 因为基础类型变量是按值传递,b=a 会给b创建一块新内存,a的改变不会影响到bvar a={name:'M416'};var b=a;console.log('b=', b);// b= {name:'M416'}a.name = '98k';console.log('b=', b);// b={name:'98k'} 因为对象类型变量是引用传递,b=a 会使b指向a所指向的内存,a的改变会影响到ba = {name:'Scar'};console.log(&#x...

imax1

box-sizing 的应用

- 发表于 2018-07-23 · 最后访问 1小时前 -

box-sizing 是 CSS3中添加的特性box-sizing 可选的值:content-box,border-box,inherit默认值是:content-box通过将 box-sizing 设置为 border-box 可以将元素的内边距和边框在元素已设定的宽度和高度下绘制,也就是说实际的宽度不会因为 padding 和 border 的变化而变化例子:// html<div class="div1"> div1</div><div class="div2"> div2</div>// css.div1{ width: 300px; height: 300px; background-color: gray; padding: 20px; box-sizing: border-box;}.div2{ width: 300px...

imax1

多个 Promise 顺序执行

- 发表于 2018-07-22 · 最后访问 2小时前 -

const timeout = ms => new Promise((resolve, reject) => { setTimeout(() => { resolve(); }, ms);});const ajax1 = () => timeout(2000).then(() => { console.log('1'); return 1;});const ajax2 = () => timeout(1000).then(() => { console.log('2'); return 2;});const ajax3 = () => timeout(2000).then(() => { console.log('3'); return 3;});const mergePromise = ajaxArray => { let p = Promise.resolve(); return Promise.all(ajaxArray.map(item => {...

imax1

JavaScript 面向对象写法

- 发表于 2018-07-20 · 最后访问 1天前 -

面向对象:黑盒子,可以在不了解原理的情况下,使用它的功能,例如:Date,Array对象组成:属性和方法对象特点:抽象(类似建模),封装,继承多重继承:一个孩子多个爹方法一:工厂方式(构造函数法)function User(name, age, sayName){ this.name = name this.age = age this.sayName = function(){ alert(this.name) }}var sadcreeper = new User('sadcreeper', 26)sadcreeper.sayName() //sadcreeper缺点:函数重复,资源浪费改进后的方法二://构造函数加属性function User(name, age, sayName){ this.name = nam...

imax1

在 create-react-app 生成的项目中使用 vw 实现移动端适配

- 发表于 2018-07-03 · 最后访问 1小时前 -

最近在开发一个移动端网页时遇到了经典的布局问题,即美工做的移动端UI图是1080*1920像素的UI图,如果直接按照UI图做出来的页面无法在手机上正常的展示,如何能够实现按照UI图1:1开发的网页能够在不同的机型上都能够比较好的显示呢?经过查阅文章,有两种方式可以实现:使用 rem+viewpoint 的方式:这种方式淘宝工程师做了个轮子,参考文章:使用Flexible实现手淘H5页面的终端适配 使用 vw 的方式:这种方式使用了CSS3新增的单位 vw 和 vh 实现,参考文章:再聊移动端页面的适配 ----以及--- 如何在Vue项目中使用vw实现移动端适配 我使用...

imax1

electron-builder 打包 electron 应用时的常见问题

- 发表于 2018-06-02 · 最后访问 23小时前 -

connect ETIMEDOUT 54.231.97.224:443如下图所示:这里我使用了科学上网,能连上YouTube的情况下,仍然出现网络错误,设置淘宝源可解决:npm config set registry https://registry.npm.taobao.org/npm config set ELECTRON_MIRROR http://npm.taobao.org/mirrors/electron/Application entry file "build\electron.js" in the "D:\..\dist\win-unpacked\resources\app.asar" does not exist.如图所示:这个问题需要把 main.js 重命名为 electron.js 然后放到 public 文件夹下,再执行 npm run build 打包到 build 文...

imax1

使用 Ant Design Mobile 的 TabBar 结合 React Router@4 的移动端布局方案

- 发表于 2018-04-29 · 最后访问 11小时前 -

And Design Mobile 是 antd 家族针对移动端出品的基于 React 的 UI 框架,用来快速搭建移动端 Web App 是一个利器,不仅包含了移动端常用的各种组件,还直接给出了几种常用的布局,非常方便,比如最常见的底部标签栏布局:TabBar 但是在使用 TabBar 的过程中我发现,文档中提供的例子是使用类似标签页的方法实现的,即多个标签页其实同时存在,只是再点击底部标签栏时,对应的标签页显示出来,其他的则隐藏这样用的话,Web App 一旦稍微复杂就会不太好,如果页面再比较多的话,就必须加入 React Router 了下面我们考虑这么几个需求,应该...

imax1

HTML 速查手册

- 发表于 2018-04-26 · 最后访问 5小时前 -

标准HTML文档<!DOCTYPE html><html><head> <title>文档的标题</title></head><body> </body></html>属性alt="示例图" //图片无法显示时的替换文字target="_self" //在当前框架打开(默认)target="_blank" //在新窗口中打开target="_parent" //在父框架集中打开target="_top" //在整个窗口中打开target="frameName" //在 frameName 框架中打开title="示例提示" //鼠...