模块化的历史和模块加载器
摘要：模块化的历史和模块加载器 [TOC] 模块化的需求来源 1. 前端代码日渐复杂，web应用越来越像桌面应用 2. 复用别人的代码 3. 更少的网络请求 http://huangxuan.me/js module 7day/ / 实现模块化 基本原理 1. 函数作用域 2. 对象写法 3. IIFE
阅读全文
posted @ 2018-09-04 21:16
随笔分类 - JavaScript
上传图片，多图上传，预览功能，js原生无依赖
摘要：最近很好奇前端的文件上传功能，因为公司要求做一个支持图片预览的图片上传插件，所以自己搜了很多相关的插件，虽然功能很多，但有些地方不能根据公司的想法去修改，而且需要依赖jQuery或Bootstrap库，所以我就想学下图片上传的原理，试着做一个原生无依赖，而且足够灵活的图片上传插件。话不多说，开整。
阅读全文
posted @ 2017-03-06 09:53
使用multer搭建一个图片接收服务器
摘要：为了测试图片上传插件的上传功能是否好用，最近尝试搭建了一个接收图片的服务器，因为图片上传的编码格式是form data，所以我选择使用express+multer，实现过程中发现有几个需要注意的地方，在这里和大家分享下。 1 引入express和multer 这里没什么好说的，安装好包文件后，引入文
阅读全文
posted @ 2017-03-05 18:37
gulp+browser-sync使用方法
摘要：gulp简介 gulp是基于流的自动化构建工具，也就是说gulp是通过操作流实现自动编译，压缩文件等操作的。这得益于node.js对流的支持，当然gulp.js和构建的任务文件都是JavaScript编写的。 安装方法： 设置自动化任务： 创建一个gulpfile.js文件，这个文件里面放置我们要设
阅读全文
posted @ 2017-02-21 14:56
小程序试用体验
摘要：最近看了小程序的文档，也试着做了几个demo，总结下感受。 特点 1、小程序的结构层次非常清晰，总体分为视图层和逻辑层两部分，在文件结构上，分为控制结构的wxml，控制样式的wxss，控制数据和逻辑的js，控制基本配置的json。但需要注意的是如果逻辑层的数据包含页面标签元素，在传入视图层时，页面标
阅读全文
posted @ 2017-01-16 22:03
函数防抖和函数分流
摘要：应用场景 我们经常需要监听滚动条滚动或者鼠标的移动，但浏览器触发这类事件的频率非常高，可能在10几毫秒就触发一次，如果我们处理事件的函数需要操作大范围的DOM，这对于浏览器的性能是个考验，可能像chrome浏览器这样优秀的浏览器会好一点，但放到老版本的IE下，就可能发生卡顿现象。有的时候，我们只需要
阅读全文
posted @ 2016-12-30 22:25
页面返回顶部的方法总结
摘要：当页面过长时，通常会在页面下方有一个返回顶部的button，总结一下，大概三种实现方法，下面说下各方法及优缺点。 方法一 锚点定位 这种方法设置方便，但缺点是会刷新页面（我是在同事的乐视手机上发现的）。 方法二 window.scrollTo(x,y) 这种方法也很方便，并且不会刷新页面，缺点是没有
阅读全文
posted @ 2016-12-29 21:56
js的单线程和异步
摘要：前言 说到js的单线程（single threaded）和异步（asynchronous），很多同学不禁会想，这不是自相矛盾么？其实，单线程和异步确实不能同时成为一个语言的特性。js选择了成为单线程的语言，所以它本身不可能是异步的，但js的宿主环境（比如浏览器，Node）是多线程的，宿主环境通过某种
阅读全文
posted @ 2016-11-14 14:11
图片预加载的几个注意点
摘要：1. 应用场景 在制作图片墙，相册这样的单页图片资源比较大的页面时，为了能让用户有流畅的使用体验，需要提前将图片缓存到本地，这就是图片预加载的用途。 2. 原理 提前将图片缓存到本地后，如果图片路径不变，页面在使用图片时，浏览器就可以直接使用缓存了。 具体方法如下： js有一个Image对象，页面中
阅读全文
posted @ 2016-11-08 20:58
如何理解和应用闭包
摘要：何为闭包 函数内部又定义了一个函数，这个子函数就可以称为闭包。 闭包的特点 闭包的一个特点就是闭包内部可以引用外部函数的变量。 原理 要理解闭包的原理，最重要的是要理解JavaScript的作用域链机制。 1. 作用域 js中作用域分为两种，全局作用域和函数作用域（局部作用域），此外js遵循的是静态
阅读全文
posted @ 2016-10-27 20:14
what's this? 浅谈js中this的指向问题
摘要：刚刚学习js的朋友可能和我一样，看到代码中的this总是一脸懵逼，不知道this到底指向谁。经过一段时间的了解，我想跟大家分享下自己的理解。 何时出现this 函数在调用的时候，会自动获得两个特殊变量：this和arguments，所以，函数可以调用this变量。 this指向谁？ 通过一段时间的练
阅读全文
posted @ 2016-10-27 20:12
