- 博客(62)
- 收藏
- 关注
RSS订阅原创 如何解决移动端300ms延迟
移动端300ms的点击延迟是怎么来的呢？ 这要追溯至 2007 年初。苹果公司在发布首款 iPhone 前夕，遇到一个问题：当时的网站都是为大屏幕设备所设计的。于是苹果的工程师们做了一些约定，应对 iPhone 这种小屏幕浏览桌面端站点的问题。 这当中最出名的，当属双击缩放(double tap to zoom)，这也是会有上述 300 毫秒延迟的主要原因。 双击缩放，顾名思义，即用手指在屏幕上快速点击两次，iOS 自带的 Safari 浏览器会将网页缩放至原始比例。 那么这和 300 毫...
2021-01-05 14:30:04
938
原创 es6-async函数的使用
async函数的使用1.什么是async函数ES2017 标准引入了 async 函数，使得异步操作变得更加方便。async 函数是什么？一句话，它就是 Generator 函数的语法糖。async 函数返回一个 Promise 对象。async 函数内部 return 语句返回的值，会成为 then 方法回调函数的参数。async 函数执行时，如果遇到 await 就会先暂停执行 ，等到触发的异步操作完成后，恢复 async 函数的执行...
2020-12-29 10:29:29
270
原创 ES6-promise使用
一、promise对象的使用所谓Promise，简单说就是一个容器，里面保存着某个未来才会结束的事件的结果。从语法上说，Promise对象用于表示一个异步操作的最终完成 (或失败), 及其结果值。对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。then 方法then 方法接收两个函数作为参数，第一个参数是 Promise 执行成功时的回调，第二个参数是 Promise 执行失败时.
2020-12-17 10:15:36
212
原创 解决跨域问题
跨域、同源策略是什么什么是跨域？定义：跨域是指从一个域名的网页去请求另一个域名的资源。但是一般情况下不能这么做，它是由浏览器的同源策略造成的，是浏览器对JavaScript施加的安全限制。跨域严格一点的定义是：只要协议，域名，端口有任何一个的不同，就被当作是跨域同源策略所谓同源是指，域名，协议，端口均相同。这里说的js跨域是指通过js在不同的域之间进行数据传输或通信，比如用ajax向一个不同的域请求数据，或者通过js获取页面中不同域的框架中(iframe)的数据。概念：只要协议、域名、端
2020-12-16 11:04:10
3977
原创 es6-generator抽奖
Generator 函数是 ES6 提供的一种异步编程解决方案，语法行为与传统函数完全不同.形式上，Generator 函数是一个普通函数，但是有两个特征。一是，function关键字与函数名之间有一个星号；二是，函数体内部使用yield表达式，定义不同的内部状态（yield在英语里的意思就是“产出”）。1.1 创建generator函数1.2 generator的基本使用for...of循环遍历1.3抽奖实现思路：通过es...
2020-12-11 10:27:29
146
原创 es6中class与ts中的class有什么区别
ts的class和es 6的class 有什么区别？两者类似但有不同点是ts多了一些修饰符类的基本使用定义一个最简单的Lady类,这里要使用关键字class,类里边有姓名属性和一个得到姓名的方法，代码如下：class Lady { content = "Hi，帅哥"; sayHello() { return this.content; }}const goddess = new Lady();console.log(goddess.sayHello());类的继承这里提前说一下...
2020-12-10 14:18:38
1644
原创 Vuex语法解析
安装vuex : cnpm i -D vuex五种属性用法import Vuex from 'vuex';import Vue from 'vue';Vue.use(Vuex);export default new Vuex.Store({ state: { amount: 0, list: [ { id: 0, name: '小三' },
2020-12-02 11:06:12
161
原创 H5小案例—地球围绕太阳旋转
ES6箭头函数与普通函数的区别ES6标准新增了一种新的函数：Arrow Function（箭头函数）。为什么叫Arrow Function？因为它的定义用的就是一个箭头：//1、没有形参的时候let fun = () => console.log('我是箭头函数'); fun();//2、只有一个形参的时候()可以省略let fun2 = a => console.log(a); fun2('aaa');//3、俩个及俩个以上的形参的时候let fun3 = (x,y) =&
2020-11-25 14:04:05
526
1
原创 如何写一篇杀手级的软件工程师简历
1、什么才是优秀简历？你以为的：HR眼中的：HR根本不关心你的简历设计有多么好看，而是关心你的简历内容是否足够优秀，所以，他们反倒偏爱这种黑白极简风格的简历。因为没有很多花哨的设计，一眼就能够看到整个简历的重点。(1)一页足矣：10 ~ 30秒的时间，可能你的第二页简历永远不会被看到。(2)留白原则：留白是中国艺术作品创作中常用的一种手法，在简历里也适用，每一行文字、每个模块之间都需要有一些间隔，使全篇更为协调和突出重点。(3)标准字体：宋体即可，别用那些花里胡哨的字体。(4)简历模板：
2020-11-24 10:33:22
306
原创 NPM怎么使用
npmNpmnpm是什么Node Package Manager : 包管理器，在Node.js应用程序中创建、共享和重用模块指令本地安装npm install 包名全局安装npm install卸载模块npm uninstall更新模块npm update查看已安装 的模块npm ls登录npmnpm login发布npm publish下架包npm unpublishnpm unpublish 模块名@版本号版本
2020-11-23 10:25:51
413
原创 css——meta标签
什么？工作好几年却不能熟练使用meta标签？小贝老师教你全方位了解并使用标签！首先，这个标签应该出现在哪里呢？meta是html语言head区的一个辅助性标签，位于文档的头部，不包含任何内容。 标签的属性定义了与文档相关联的名称/值对。meta标签提供关于HTML文档的的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词上面文字中的关键字 “元信息”指的是什么呢？元数据不会显示在页面上，但是对于机器是可读的。它可用于浏览器（如何显示内容或重新加载页面），搜索引擎（
2020-11-20 10:54:35
1250
原创 h5-js编码和解码
编码就是把能看的懂得字符转换成一些奇奇怪怪的二进制字节码文件解码就是把哪些看不懂的二进制字节码转换成能看的懂得字符为什么要进行编码在URI的最初设计时，希望能通过书面转录，比如写在餐巾纸上告诉另外一人，因此URI的构成字符必须是可写的ASCII字符。在这些可书写的字符里，由于一些字符在不同操作系统的编码有不同的解析，被包含在“不安全字符”之中，要格外注意。废话少说，我们先来准备一个字符串...
2019-09-03 09:24:39
1294
原创 px、rem、em的区别
随着css学习的不断深入页面也随之丰富，那么em、rem、px是我们在页面布局中经常会用到的单位，也是面试题中老生常谈的一个问题，经久不衰，那我们今天用我们的小案例来解释他们的区别吧！PXpx这个单位用的非常多，我们大多数人都很熟悉了吧。px单位的名称为像素，它是一个固定大小的单元，像素的计算是针对（电脑/手机）屏幕的，一个像素（1px）就是（电脑/手机）屏幕上的一个点，即屏幕分辨率的最小分割...
2019-08-29 09:34:56
156
原创 使用@font-face
@font-face的作用是让我们在设计中使用自定义的字体。1、实际应用：假设你想使用的字体没有广泛安装，而是一个特别的字体，那么借助@font-face的魔力，我们可以设置一个专门的字体系列名称，对应服务器上面的一个文字文件。用户代理将下载那个文件，使用它渲染页面重的文本，就好像用户安装了哪个字体。代码如下：@font-face{Font-family:’SeitzeraADG’;S...
2019-08-29 09:28:18
430
原创 mock
#出现的原因1、开发进度的不同2、前后端分离#优势1、前后端分离—–定义好接口文档之后，前端人员不用再等待后台的接口2、增加测试的真实性3、可拦截Ajax请求，并返回请求4、易上手5、数据类型丰富、支持扩展#安装及使用引入mockjs ： http://mockjs.com/dist/mock.js模拟数据Mock.mock( rurl, rtype, fun...
2019-08-27 08:55:24
144
原创 十天上手Node+KOA(3)
###任务1、进程与线程的了解2、process3、child_process4、守护子进程####1、进程与线程的了解进程进程 是计算机中的程序关于某数据集合上的一次运行的活动，是系统进行资源分配和调度的基本单位，是操作系统结构的基础每个进程都拥有直接独立空间地址、数据栈一个进程无法访问另一个进程里面定义的变量、数据结构但是可以通过建立IPC通信，进程之间可以实现数据共享进...
2019-08-22 19:30:44
672
原创 offsetHeight,clientHeight,innerHeight,outerHeight,scrollHeight区别
元素偏移区域offsetWidth (border + padding+width)offsetHeight (border + padding + height)offsetLeft (元素距离定位父级左内边线的水平距离)offsetTop (元素距离定位父级上内边线的垂直距离)offsetParent (获取元素定位父级，父级加除了position:inherit|initial...
2019-08-19 16:37:16
522
原创 自定义指令、计算属性、侦听器
四、自定义指令钩子函数一个指令定义对象可以提供如下几个钩子函数 (均为可选)：bind：只调用一次，指令第一次绑定到元素时调用。在这里可以进行一次性的初始化设置。inserted：被绑定元素插入父节点时调用 (仅保证父节点存在，但不一定已被插入文档中)。update：所在组件的 VNode 更新时调用，但是可能发生在其子 VNode 更新之前。指令的值可能发生了改变，也可能没有。但是你...
2019-08-16 10:47:30
107
原创 render函数
Vue 推荐在绝大多数情况下使用模板来创建你的 HTML。然而在一些场景中，你真的需要 JavaScript 的完全编程的能力。这时你可以用渲染函数，它比模板更接近编译器。让我们深入一个简单的例子，这个例子里 render 函数很实用。假设我们要生成一些带锚点的标题：<h1> <a name="hello-world" href="#hello-world"> ...
2019-08-16 10:42:15
1526
原创 搜索引擎-搜索引擎SEO优化
什么叫做搜索引擎搜索引擎（search engine）是一种信息检索系统，旨在协助搜索存储在计算机系统中的信息什么叫搜索引擎优化搜索引擎优化（search engine optimization）简称SEO，是一种透过了解搜索引擎的运作规则来调整网站，以提高目的网站在有关搜索引擎内排名的方式为什么要进行搜索引擎优化SEO可以帮助你打造品牌SEO可以获得更多流量SEO不需要为广告付费...
2019-08-15 09:23:05
473
原创 mvc、mvvm及原生实现数据劫持和指令解析
Vuevue是一套用于构建用户界面的渐进式框架（没有强主张，就是强制要求用了vue，就必须使用与vue相关的其他东西才可以进行项目的开发，我们可以任意组合），也是一个mvvm的框架，mvvm（model-view-viewmodel），就是通过数据(model)驱动视图(view)，而视图的改变也可以修改数据，而负责视图和数据联系的就是viewmodel使用javascrit操作html到...
2019-08-14 10:48:27
132
原创 十天上手Node+KOA(2）
###任务1、进程与线程的了解2、process3、child_process4、守护子进程####1、进程与线程的了解进程进程 是计算机中的程序关于某数据集合上的一次运行的活动，是系统进行资源分配和调度的基本单位，是操作系统结构的基础每个进程都拥有直接独立空间地址、数据栈一个进程无法访问另一个进程里面定义的变量、数据结构但是可以通过建立IPC通信，进程之间可以实现数据共享进...
2019-08-12 08:55:19
177
原创 Buffer简单理解及常用方法介绍
#####Buffer 介绍javascript 中对数据处理都是以字符串的形式，而对于二进制数据就不便于处理，所以 Buffer 便是用于读取或操作二进制数据的对象。通俗来说Buffer其实就是处理数据的方法，这点在官网文档里解释的很详细。Buffer 是内存拷贝，而不是内存共享。Buffer 占用内存被解释为一个数组，而不是字节数组。比如，new Uint32Array(new B...
2019-08-09 17:33:08
3865
原创 js的第七种数据类型Symbol
Symbol类型是ES6中新加入的一种原始类型。每个从Symbol()返回的symbol值都是唯一的。一个symbol值能作为对象属性的标识符；这是该数据类型仅有的目的。下面来看看Symbol类型具有哪些特性。Symbol的特性1.独一无二直接使用Symbol()创建新的symbol变量，可选用一个字符串用于描述。当参数为对象时，将调用对象的toString()方法。var ...
2019-08-09 08:49:10
448
原创 Node
先发布任务~一、 搭建服务二、请求与响应三、http客户端请求四、同源策略及JSONP####一、搭建服务、二、请求与响应在nodeJS搭建http服务端或者http客户端离不开http模块，#####第一步，引入http模块(包)const http = require('http');#####第二步： 创建服务http.createServer返回一个服务的实例，其参数...
2019-07-28 20:54:48
77
原创 express的request-和-response-对象详细介绍
request 和 response 对象的具体介绍：Request 对象 - request 对象表示 HTTP 请求，包含了请求查询字符串，参数，内容，HTTP 头部等属性。常见属性有：req.app：当callback为外部文件时，用req.app访问express的实例req.baseUrl：获取路由当前安装的URL路径req.body / req.cookies：获得「请求主体」...
2019-07-27 10:59:26
1084
原创 js实现继承的六种方式
js实现继承的六种方式继承，顾名思义就是子类通过一定的方式拥有父类的属性和方法，一个简单的栗子：有一个孩子，他拥有一个很有钱父亲，他的父亲不仅有钱，还有很多的人脉，那么他想要得到他父亲的钱和人脉来让自己变得有钱和强大，就必须通过自己的方式（比如努力）去继承他父亲拥有的这些，而靠自己去实现这些则会变得困难，因为需要从0开始，而js的继承也是如此。因此，我们必须先拥有一个父类，来提供继承的属性和方...
2019-07-27 10:58:34
85
原创 koa-session模块
koa-session模块下载npm install koa-session --save配置const session_signed_key = ["签名，可以理解为一个标识"]; // 这个是配合signed属性的签名keyconst session_config = { key: 'koa:sess', /** cookie的key。 (默认是 k...
2019-07-23 16:57:40
197
原创 前端必会知识点-浏览器真的事很多
哒哒哒~输入url###一、DNS解析客户端：用户输入url回车了，瞅瞅又让俺去哪？我脑子里不记得之前访问过;客户端：hosts 你知道那货想去哪吗？Hosts: 俺也不知道，去找DNS吧，俺有就给你了;客户端：好勒，我去找DNS老大哥;浏览器收到用户输入的域名地址后，会先查询浏览器缓存， 浏览器会缓存之前拿到的DNS 2-30分钟时间如果没有则去找本地hosts文件，检查在文...
2019-07-22 08:39:04
552
原创 前端必会知识点-浏览器的渲染机制
面试肯定会问到这个吧~So：再一次的屡屡浏览器的渲染机制~在渲染一开始会先从网络层获取请求文档（HTML、XML）的内容，然后再进行以下基本流程####3.1 解析HTML =》 DOM树从HTML文本解析到HTML语法树，再解析到文档对象树（DOM Tree）HTML语法树生成的两个过程词法解析： 按照词法规则将HTML文本分割成大量的标记(Token), 并去除其中无关的字符(...
2019-07-20 09:22:21
187
原创 配置mysql数据库及可视化管理工具navicat
数据库安装mysql官网下载安装包，直接安装mac上安装mysql更简单，在设置中就可以看到并启动，网上有很多教程，可视化管理工具可以使用sequel pro本篇文章主要讲windows下配置环境变量例如我的mysql安装在C:\Program Files\MySQL\MySQL Server 5.7则打开电脑的环境变量配置，在path最后以;（分号）分割，加入C:\Progr...
2019-07-19 10:41:53
1663
原创 js中form表单属性介绍及阻止默认跳转和获取后端返回数据的方法
js中form表单属性介绍及阻止默认跳转和获取后端返回数据的方法method请求方式，一般使用get和postenctypeapplication/x-www-form-urlencoded对所有字符都会进行编码（空格转换为 “+” 加号，特殊符号转换为 ASCII HEX 值）multipart/form-data不对字符编码。在使用包含文件上传控件的表单时，必...
2019-07-18 15:02:58
1645
原创 快速实现-简单分页器优化考虑
####1. 数据的本地存储在短时间内点击页码的时候，我们是可以选择先不请求数据的，也就是说，在快速重复点击的时候，我们可以不作为某页码第一次请求数据，我们可以记录下时间戳，并且存储在localStorage3.1 在短时间再次点击该页码的同时，可以先从localStorage中取出，并对比时间间隔，如果时间间隔过长，我们可以请求新的数据，如果时间间隔过短，我们可以采用本地数据###...
2019-07-17 11:58:02
93
原创 移动端调试工具及相关概念总结
pc端软件和移动端apppc端软件如：photoshop、360、腾讯QQ、谷歌浏览器等移动端app如：手机版QQ、微信、360、美颜相机等程序和软件的概念程序就是一段代码，一个功能，或者一个函数、一段逻辑，而软件就是由大大小小的程序文件通过文件夹归类整合组织在一起而形成的一个集合，我们每次安装软件都会选择安装位置，当我们查看安装位置的文件夹时，就会发现，软件其实...
2019-07-16 13:52:38
170
原创 快速实现-简单分页器(下)
上一节的分页器只能实现简单的效果，是无法点击到中间页码的这一节，我们需要稍微改造一下考虑问题：当点击到5， 6， 7的时候页码应该是活动的，并且页码向后移动这时应该出现两边都有省略号So我们完全可以将上一节左右两边都有省略号的情况抠出来，作为函数around在首页情况下的时候，做一次判断，判断当前页码 离首页 间隔有一定数量的时候，使其变为两边都有省略号的效果在...
2019-07-13 09:51:57
340
原创 快速实现-简单分页器(上)
首先形形色色的分页器大家肯定都看过，这一次就快速实现一个简单的分页器，应该不会耽搁太久吧~先来看一下简洁布局：瞜一眼这布局：页码数量总共只有9个当足够显示所有页码的情况就全部显示了那么问题来了，如果不够呢？第一种情况第二种情况第三种情况正点：总共只能显示九个页码当不够的是则显示省略号最主要的是省略号的位置，而省略号的位置由取决于当前页码处于哪里3....
2019-07-13 09:50:45
1760
原创 二进制转换及javascript的位操作符
位操作符因为位操作符在数值都表示的最底层的操作，因此性能上比其他操作符要好,只做了解，性能好，但是会导致代码可读性降低二进制二进制是计算技术中广泛采用的一种数制。二进制数据是用0和1两个数码来表示的数。它的基数为2，进位规则是“逢二进一”，借位规则是“借一当二”，由18世纪德国数理哲学大师莱布尼兹发现。当前的计算机系统使用的基本上是二进制系统，数据在计算机中主要是以补码的形式存储的。计算...
2019-07-13 08:55:01
302
原创 canvas效果案例：透明球
canvas效果案例：透明球1.1随机生成球1.1.1球的大小1.1.2球的颜色1.1.3球心的位置1.1.4每个球的步长（x,y）1.2 随机生成的球都是一个对象，将其数据存储至数组当中1.3 每一帧都清除画布，重新循环数组中的每个球，绘制到画布上1.4 移动的区间范围是固定的，因此每个球都需要判断其（圆心的位置 + 半径）是否超出了可视范围，如果超出了则需要反向...
2019-07-12 19:03:52
269
原创 快速实现-简单的分页器
首先形形色色的分页器大家肯定都看过，这一次就快速实现一个简单的分页器，应该不会耽搁太久吧~先来看一下简洁布局：瞜一眼这布局：页码数量总共只有9个当足够显示所有页码的情况就全部显示了那么问题来了，如果不够呢？第一种情况第二种情况第三种情况正点：总共只能显示九个页码当不够的是则显示省略号最主要的是省略号的位置，而省略号的位置由取决于当前页码处于哪里3....
2019-07-12 08:50:44
351
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人