- 博客(142)
- 问答 (1)
- 收藏
- 关注
RSS订阅原创 js获取页面上的所有标签
new Set([...document.querySelectorAll('*')].map(v => v.tagName));new Set(Array.from(document.querySelectorAll('*')).map(v => v.tagName));
2019-03-30 18:58:56
3200
原创 js将每个单词的首字母变为大写
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...
2019-03-26 14:57:33
4379
原创 vue使用canvas生成地图图例
1.写canvas标签&lt;canvas ref='cvs' width="150px" height="200px"&gt;&lt;/canvas&gt;2.数据 ldata:[{ "label": "30000 以上", &
2019-03-14 11:19:10
2584
2
转载 js中生成唯一id的方法
1.随机数长度控制,定义一个长度变量（length），生成可控长度的随机数Math.random().toString(36).substr(3,length)2.引入时间戳Date.now().toString(36)3.合在一起最终办法genID(length){return Number(Math.random().toString().substr(3,length) + Da...
2019-03-12 17:42:12
1635
原创 前端使用blob下载文件
const url = '/download/possible' let downData = { 'param':JSON.stringify(selectData) } const options = { method: 'POST', headers: { 'cont...
2019-03-12 17:31:40
4844
2
原创 element ui里边el-tree的使用方法
&lt;el-tree :data="data2" show-checkbox node-key="id" ref="DeviceGroupTree" @check-change="handleChangeCl
2019-03-12 17:27:35
9657
原创 js中instanceof原理
instanceof运算符用于测试构造函数的prototype属性是否出现在对象的原型链中的任何位置function Car(make, model, year) { this.make = make; this.model = model; this.year = year;}var auto = new Car('Honda', 'Accord', 1998);conso...
2019-03-04 14:07:00
2126
原创 js 里边的new都做了什么及实现一个new
//new 的实现//new 都做了什么//1.创建了一个新对象//2.将构造函数作用域赋值一个新对象,this指向这个新对象//3.执行构造函数中的代码(为这个函数添加新属性)//4.返回新对象function create (){ //创建一个空对象 var obj = new Object() //获取构造函数，arguments的第一个参数,因为ar...
2019-03-04 13:33:15
474
原创 js 实现一个深拷贝
function deepClone(obj) { function isObject(o) { return (typeof o === 'object' || typeof o === 'function') && o !== null } if (!isObject(obj)) { throw new Error('非对象') } le...
2019-03-01 15:15:51
533
原创 es6中的Reflect
// Reflect对象与Proxy对象一样，也是 ES6 为了操作对象而提供的新 API。Reflect对象的设计目的有这样几个。// （1） 将Object对象的一些明显属于语言内部的方法（比如Object.defineProperty），放到Reflect对象上。//现阶段，某些方法同时在Object和Reflect对象上部署，未来的新方法将只部署在Reflect对象上。也就是说，从R...
2019-03-01 11:54:33
136
原创 es6中的 Proxy
//let p = new Proxy(target, handler)//target 代表需要添加代理的对象，handler 用来自定义对象中的操作，比如可以用来自定义 set 或者 get 函数//new Proxy()表示生成一个Proxy实例，target参数表示所要拦截的目标对象，handler参数也是一个对象，用来定制拦截行为var proxy = new Proxy({},...
2019-03-01 11:37:59
149
转载 vue nextTick的使用
在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法，获取更新后的 DOMVue 是异步执行 DOM 更新的，这就用到了事件循环机制，//改变数据vm.message = 'changed'//想要立即使用更新后的DOM。这样不行，因为设置message后DOM还没有更新console.log(vm.$el.textContent) // 并不会得到'chang...
2019-02-25 15:08:10
135
转载 vue实现路由按需加载
1.使用vue异步组件的方式vue-router配置路由 , 使用vue的异步组件技术 , 可以实现按需加载 .但是,这种情况下一个组件生成一个js文件/* vue异步组件技术 */{ path: '/home', name: 'home', component: resolve => require(['@/components/home'],resolve)},{...
2019-02-25 14:21:14
509
原创 vue router 导航守卫
vue-router 提供的导航守卫主要用来通过跳转或取消的方式守卫导航。有多种机会植入路由导航过程中：全局的, 单个路由独享的, 或者组件级的判断用户有没有登录// 全局路由守卫router.beforeEach((to, from, next) => { const userdata = Cookies.get('userdata') if (!userdata) { ...
2019-02-25 14:02:20
258
原创 es6 map数据结构
//map数据结构//Set类似于数组，而Map就类似于键值对（Key, Value）；//ES6 提供了 Map 数据结构。它类似于对象，也是键值对的集合，但是“键”的范围不限于字符串，各种类型的值（包括对象）都可以当作键。const map2 = new Map([ ["name","wangyawei"], ["age",24]])console.log(map2.si...
2019-02-23 22:09:06
178
原创 ES6 set数据结构
//set 数据结构//ES6 提供了新的数据结构 Set。它类似于数组，但是成员的值都是唯一的，没有重复的值//Set 本身是一个构造函数，用来生成 Set 数据结构。const s = new Set()let arr = [2, 3, 5, 4, 5, 2, 2]arr.forEach(ele => { s.add(ele)})for(let i of s){...
2019-02-23 21:49:06
205
原创 js中的观察者模式
观察者模式是发布加订阅/观察者模式//订阅类class Subject { constructor (){ this.state = 0 this.observers = [] //所有的观察者 } getState() { return this.state } setState(state){ ...
2019-02-20 14:25:12
1245
原创 TypeScript类
传统方法中，JavaScript 通过构造函数实现类的概念，通过原型链实现继承。而在 ES6 中，我们终于迎来了 class。类(Class)：定义了一件事物的抽象特点，包含它的属性和方法对象（Object）：类的实例，通过 new 生成面向对象（OOP）的三大特性：封装、继承、多态封装（Encapsulation）：将对数据的操作细节隐藏起来，只暴露对外的接口。外界调用端不需要（也不可...
2019-02-04 17:06:30
148
原创 TypeScript枚举
枚举（Enum）类型用于取值被限定在一定范围内的场景，比如一周只能有七天，颜色限定为红绿蓝等。枚举使用 enum 关键字来定义：enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat}枚举成员会被赋值为从 0 开始递增的数字，同时也会对枚举值到枚举名进行反向映射enum Days {Sun, Mon, Tue, Wed, Thu, Fri, Sat};...
2019-02-04 16:34:30
729
原创 TypeScript 数组
1.数组的声明let arr1:number[ ] //声明一个数值类型的数组let arr2:Array<string> //声明一个字符串类型的数组2.数组初始化//定义一个空数组，数组容量为0let arr1:number[] = [] //定义一个数组时，直接给数组赋值let arr2:number[] = [1,2,3,4,5]//定义数组 的同事...
2019-02-04 16:19:45
2851
原创 TypeScript函数
在TypeScript里定义函数跟JavaScript稍微有些不同function sum(x: number, y: number): number { return x + y;}需要注意的是：声明（定义）函数必须加 function 关键字；函数名与变量名一样，命名规则按照标识符规则；函数参数可有可无，多个参数之间用逗号隔开；每个参数参数由名字与类型组成，之间用分号隔...
2019-02-04 11:51:41
320
原创 TypeScript开发环境配置
TypeScript 是一种由微软开发的自由和开源的编程语言。它是 JavaScript 的一个超集，TypeScript 在 JavaScript 的基础上添加了可选的静态类型和基于类的面向对象编程。其实TypeScript就是相当于JavaScript的增强版，但是最后运行时还要编译成JavaScript。TypeScript最大的目的是让程序员更具创造性，提高生产力，它将极大增强JavaS...
2019-02-04 11:02:02
772
原创 koa2如何允许跨域
们都知道 当域名、端口、协议有任意一个不一样的时候就会存在跨域，那么跨域如何解决呢，有好多种方式：1、后台允许跨域2、jsonp3、websocket4、iframe…等用koa2写了一个RESTful api，但是调试这个接口的时候，发现需要跨域，下面我们看看koa2-cors如何设置koa2后台允许跨域。安装koa2-corsnpm install --save koa2-co...
2019-02-01 22:00:41
16785
3
原创 koa-static静态资源中间件
在后台开发中不仅有需要代码处理的业务逻辑请求，也会有很多的静态资源请求。比如请求js，css，jpg，png这些静态资源请求。也非常的多，有些时候还会访问静态资源路径。用koa2自己些这些静态资源访问是完全可以的，但是代码会雍长一些。安装koa-staticnpm install --save koa-static使用const Koa = require('koa')const pa...
2019-02-01 21:57:43
1317
原创 Koa2中Session koa-session的使用
session是另一种记录客户状态的机制，不同的是Cookie保存在客户端浏览器中，而session保存在服务器上。工作原理当浏览器访问服务器并发送第一次请求时，服务器端会创建一个session对象，生成一个类似于key,value的键值对， 然后将key(cookie)返回到浏览器(客户)端，浏览器下次再访问时，携带key(cookie)，找到对应的session(value)。 客户的信...
2019-02-01 21:53:54
1815
原创 Koa2中 Cookie的使用
开发中制作登录和保存用户信息在本地，最常用的就是cookie操作。比如我们在作一个登录功能时，希望用户在接下来的一周内都不需要重新登录就可以访问资源，这时候就需要我们操作cookie来完成我们的需求。koa的上下文（ctx）直接提供了读取和写入的方法。ctx.cookies.get(name,[optins]):读取上下文请求中的cookie。ctx.cookies.set(name,val...
2019-02-01 21:48:14
370
原创 koa2接收get和post请求
1.koa2接收get请求 在koa2中GET传值通过request接收，但是接收的方法有两种：query和querystring。 query：返回的是格式化好的参数对象。 querystring：返回的是请求字符串。const Koa = require('koa');const Router = require('koa-router');const app = new K...
2019-02-01 21:39:13
4184
原创 koa2之koa-router组件
路由（Routing）是由一个 URI（或者叫路径）和一个特定的 HTTP 方法（GET、POST 等）组成的，涉及到应用如何响应客户端对某个网站节点的访问。通俗的讲：路由就是根据不同的URL地址，加载不同的页面实现不同的功能。Koa中的路由和Express有所不同，在Express中直接引入Express就可以配置路由，但是在Koa中我们需要安装对应的koa-router路由模块来实现。n...
2019-02-01 21:30:56
715
原创 koa简介
Koa 是一个新的 web 框架，由 Express 幕后的原班人马打造， 致力于成为 web 应用和 API 开发领域中的一个更小、更富有表现力、更健壮的基石。 通过利用 async 函数，Koa 帮你丢弃回调函数，并有力地增强错误处理。 Koa 并没有捆绑任何中间件， 而是提供了一套优雅的方法，帮助您快速而愉快地编写服务端应用程序。安装koa2因为node.js v7.6.0开始完全支持a...
2019-02-01 21:16:11
987
原创 Nodejs文件操作
1.fs.stat 检测是文件还是目录var fs=require('fs');fs.stat('html',function(err,stats){ if(err){ console.log(err); return false; } console.log('文件：'+stats.isFile()); console.log('目录：'+stats.isDirect...
2019-01-31 23:55:30
575
原创 Nodejs中的path模块
path 模块提供了一些工具函数，用于处理文件与目录的路径const path = require('path');1.path.dirname(filepath)获取路径const path=require("path");var filepath='/node/base/path/test.js';console.log( path.dirname(filepath))...
2019-01-31 23:30:02
859
转载 nodejs中url模块。
nodejs里面的一个简单的模块，url模块。url一共提供了三个方法，分别是url.parse(); url.format(); url.resolve()1 url.parse(urlString,boolean,boolean)parse这个方法可以将一个url的字符串解析并返回一个url的对象参数：urlString指传入一个url地址的字符串第二个参数（可省）传入一个布尔值...
2019-01-31 23:11:39
598
1
原创 nodejs中的事件events
因为在node当中的大部分功能模块都依赖了events，所以events模块是Nodejs当中非常重要的模块之一。events对外暴露的是一个class即EventEmitter。EventEmitter的作用有两个，分别是对事件的监听与发射。const EventEmitter = require('events');class MyEmitter extends EventEmitte...
2019-01-31 22:59:30
126
转载 nodejs之事件驱动、非阻塞
事件驱动的模型事件驱动的原理原理总结：Nodejs 会把所有请求和异步操作都放到一个事件队列中，用户的每一个请求就是一个事件。主线程先把普通代码执行完毕，然后会循环事件队列里的函数，如果遇到有IO的操作，nodejs会去线程池里拿出一个线程去执行IO的操作，执行完毕后再把拿到数据的回调函数，放到事件队列的尾部，继续事件循环。IO 操作io操作就是以流的形式，进行的操作，比如网络请...
2019-01-31 22:40:01
223
转载 Node.js中的Event Loop
Node.js是单线程的Event Loop，但是它的运行机制不同于浏览器环境。Node.js的运行机制如下。（1）V8引擎解析JavaScript脚本。（2）解析后的代码，调用Node API。（3）libuv库负责Node API的执行。它将不同的任务分配给不同的线程，形成一个Event Loop（事件循环），以异步的方式将任务的执行结果返回给V8引擎。（4）V8引擎再将结果返回给...
2019-01-31 22:26:11
115
原创 es6扩展运算符
数组的扩展运算符扩展运算符（spread）是三个点（…）。它是将一个数组转为用逗号分隔的参数序列。let arr = [];arr.push(...[1,2,3,4,5]);console.log(arr); //[1,2,3,4,5]console.log(1, ...[2, 3, 4], 5) //1 2 3 4 5作用1.合并数组const a1 = [1, 2, 3], ...
2019-01-30 23:33:56
91
原创 js formData对象
formData对象用于组装表单数据，以键值对的形式存在。FormData 首先是一个构造函数，用来生成实例var formdata = new FormData(form);FormData()构造函数的参数是一个表单元素，这个参数是可选的。如果省略参数，就表示一个空的表单，否则就会处理表单元素里面的键值对。<form id="myForm" name="myForm">...
2019-01-24 16:19:14
1444
原创 web worker简介
我们都知道JavaScript这个语言在执行的时候是采用单线程进行执行的，也就是说在同一时间只能做一件事，这也和这门语言有很大的关系，采用同步执行的方式进行运行，如果出现阻塞，那么后面的代码将不会执行，HTML5则提出了web Worker标准，表示JavaScript允许有多个线程，但是子线程完全受主线程的控制，切子线程不能操作DOM，只有主线程可以操作DOM，所以以主线程为主的单线程执行原理成...
2019-01-24 02:32:21
121
原创 js深拷贝与浅拷贝
在JavaScript中对象的浅拷贝和深拷贝有如下区别：浅拷贝:仅仅复制对象的引用,而不是对象本身。深拷贝:复制对象所引用的全部对象。浅拷贝的时候如果数据是基本数据类型，那么就如同直接赋值那种，会拷贝其本身，如果除了基本数据类型之外还有一层对象，那么对于浅拷贝而言就只能拷贝其引用，对象的改变会反应到拷贝对象上；但是深拷贝就会拷贝多层，即使是嵌套了对象，也会都拷贝出来。浅拷贝1.自定义实现...
2019-01-24 02:22:29
85
原创 js正则表达式
var t = 'sda43645dfgkl' var reg = /\d/ //字面量 var reg = new RegExp('\d') //构造函数 //reg.test(str) ：判断字符串中是否具有指定模式的子串，返回结果是一个布尔类型的值 console.log(reg.test(t)) ...
2019-01-24 01:37:08
107
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人