Prototype

<! DOCTYPE HTML > < html > < head > < meta http-equiv ="Content-Type" content ="text/html; charset=utf-8" > < title >自定义事件拖拽组件 </ title > < style > #div1 { width : 100px ; height : 100px ; background : red ; position : absolute ; } #div2 { width : 100px ; height : 100px ; background : yellow ; position : absolute ; left : 100px ; } #div3 { width : 100px ; height : 100px ; background : blue ; position : absolute ; left : 200px ; } #div4 { width : 100px ; height : 100px ; background : green ; position : absolute ; left : 300px ; } </ style > </ head > < body > < div id ="div1" ></ div > < div id

Node的产生，大大推动了 Javascript 这门语言在服务端的发展，使得前端人员可以以很低的门槛转向后端开发。 当然，这并不代表迸发成了 全栈 。全栈的技能很集中，绝不仅仅是前端会写一些 HTML 和一些 交互 ，后台熟悉 数据库的增删查改 。 想必接触过Node的人都知道，Node是以 异步(Async)回调 著称的，其异步性提高了程序的执行效率，但同时也减少了程序的可读性。如果我们有几个异步操作，并且后一个操作需要前一个操作返回的数据才能执行，这样按照Node的一般执行规律，要实现有序的异步操作，通常是一层加一层嵌套下去。 为了解决这个问题，ES6提出了 Promise 的实现。 含义 Promise 对象用于一个异步操作的最终完成（或失败）及其结果值的表示 。简单点说，它就是用于处理异步操作的，异步处理成功了就执行成功的操作，异步处理失败了就捕获错误或者停止后续操作。 它的一般表示形式为： new Promise( /* executor */ function(resolve, reject) { if (/* success */) { // ...执行代码 resolve(); } else { /* fail */ // ...执行代码 reject(); } } ); 其中，Promise中的参数 executor 是一个执行器函数，它有两个参数

摘要： ## 前言 在上一篇 [《 ES6 系列 Babel 是如何编译 Class 的(上)》](https://github.com/mqyqingfeng/Blog/issues/105)，我们知道了 Babel 是如何编译 Class 的，这篇我们学习 Babel 是如何用 ES5 实现 Class 的继承。 ## ES5 寄生组合式继承 ```js function Pare 前言 在上一篇 《 ES6 系列 Babel 是如何编译 Class 的(上)》 ，我们知道了 Babel 是如何编译 Class 的，这篇我们学习 Babel 是如何用 ES5 实现 Class 的继承。 ES5 寄生组合式继承 function Parent (name) { this.name = name; } Parent.prototype.getName = function () { console.log(this.name) } function Child (name, age) { Parent.call(this, name); this.age = age; } Child.prototype = Object.create(Parent.prototype); var child1 = new Child('kevin', '18'); console.log

　　这篇文章我会仿照vue写一个双向绑定的实例，主要实v-model , v-bind , v-click 1、原理 　　Vue的双向数据绑定的原理大家可能或多或少了解一点，主要是通过 Object 对象的 defineProperty 属性，重写data的 set 和 get 函数来实现的。 　　 2、页面结构 　　 包含了　 一个input，使用v-model指令 一个button，使用v-click指令 一个h3，使用v-bind指令。 我们最后会通过类似于vue的方式来使用我们的双向数据绑定，结合我们的数据结构添加注释： 首先我们需要定义一个myVue构造函数： 为了初始化这个构造函数，给它添加一个 _init 属性： 接下来实现 _obverse 函数，对data进行处理，重写data的set和get函数： 并改造_init函数 接下来我们写一个指令类Watcher，用来绑定更新函数，实现对DOM元素的更新。 更新 _init 函数以及 \_obverse 函数： 那么如何将view与model进行绑定呢？接下来我们定义一个 _compile 函数，用来解析我们的指令（v-bind,v-model,v-clickde）等，并在这个过程中对view与model进行绑定。 至此，我们已经实现了一个简单vue的双向绑定功能，包括v-bind, v-model, v

1 前言 1.1 业务场景 由前台导入Excel表格，获取批量数据。 根据一个数组导出Excel表格。 2 实现原理 2.1 引入工具库 file-saver、xlsx、script-loader npm install -S file-saver xlsx npm install -D script-loader 2.2 导入Excel 2.2.1 Element 上传控件 <el-upload class="upload-demo" action="" :on-change="handleChange" :on-exceed="handleExceed" :on-remove="handleRemove" :file-list="fileListUpload" :limit="limitUpload" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel" :auto-upload="false"> <el-button size="small" type="primary">点击上传</el-button> <div slot="tip" class="el-upload__tip">只 能 上 传 xlsx / xls 文 件<

jQuery的无new构建 jQuery框架的核心就是从HTML文档中匹配元素并对其执行操作、 回想一下使用 jQuery 的时候，实例化一个 jQuery 对象的方法： // 无 new 构造 $('#test').text('Test' ); // 当然也可以使用 new var test = new $('#test' ); test.text( 'Test' ); 大部分人使用 jQuery 的时候都是使用第一种无 new 的构造方式，直接 $('' ) 进行构造，这也是 jQuery 十分便捷的一个地方。 当我们使用第一种无 new 构造方式的时候，其本质就是相当于 new jQuery()，那么在 jQuery 内部是如何实现的呢？看看： ( function (window, undefined) { var // ... jQuery = function (selector, context) { // The jQuery object is actually just the init constructor 'enhanced' return new jQuery.fn.init(selector, context, rootjQuery); }, jQuery.fn = jQuery.prototype = { init: function