- 博客(60)
- 收藏
- 关注
RSS订阅原创 node
Nodejs介绍Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境，是一个应用程序。官方网址 https://nodejs.org/en/，中文站 http://nodejs.cn/作用解析运行 JS 代码操作系统资源，如内存、硬盘、网络应用场景APP 接口服务，例如 RESTful API聊天室（本身没有太多的逻辑，只需要请求API，组织数据进行返回即可）动态网站（服务器渲染页面）,个人博客, 论坛, 商城后端的Web服务，例如服务器端的请求
2020-07-07 07:39:27
276
原创 网络篇
TCP / HTTP/ HTTPSTCPTCP 和 UDP 的区别TCP的三次握手和四次挥手HTTPHTTP中GET与POST的区别http发展历程什么是Keep-Alive管道机制多路复用Server PushHTTPS网络安全TCPTCP 和 UDP 的区别TCP是一个面向连接的、可靠的、基于字节流的传输层协议。而UDP是一个面向无连接的传输层协议。TCP的三次握手和四次挥手三次握手：建立连接时，客户端发送SYN包到服务器，等待服务器响应。（SYN 同步序列编号，是建立连接时使用的握手信
2020-07-01 12:48:39
186
原创 小程序面试题
< a href=“https://juejin.im/post/5d5bf86ae51d4561bb33fb54”>前端面试-微信小程序面试题< /a>< a href=“https://juejin.im/post/5da444ab6fb9a04e054d93d8”>前端小程序笔试面试题< /a>target和currentTarget的区别e.target : 指向引发触发事件的元素e.currentTarget : 指向的是给绑定事件监听的那个
2020-07-01 12:06:50
339
原创 css面试题
BFCBFC块级格式上下文，是页面上一个独立的容器，容器内的子元素不会影响到外边的元素，垂直方向边距重叠，计算高度是浮动元素也会计算BFC触发：根元素（html），浮动元素（float不为none），绝对定位元素（position为absolute和fixed）,行内块元素（display为inline-block），overflow值不为visible，弹性元素（display为flex）应用场景：设置元素为BFC防止浮动高度塌陷，避免外边距重叠清除浮动空div⽅法： < div styl
2020-07-01 08:17:17
114
原创 JS面试题
霖呆呆的近期面试128题汇总(含超详细答案) | 掘金技术征文由浅入深，66条JavaScript面试知识点2020 前端面试 | 第一波面试题总结2020 前端面试 | 第二波面试题总结window.onload和$(document).ready()区别window.onload必须等到页面内的所有元素加载完毕后才能执行所有元素是指包括页面结构、内容及所有关联文件，如站内与站外的js与css文件、图片等。$(document).ready()是页面DOM结构绘制完毕后就执行，不必等到加载完
2020-06-30 19:12:57
128
原创 回流、重绘
定义回流必将引起重绘，重绘不一定会引起回流。当Render Tree中部分或全部元素的尺寸、结构、或某些属性发生改变时，浏览器重新渲染部分或全部文档的过程称为回流。当页面中元素样式的改变并不影响它在文档流中的位置时（例如：color、background-color、visibility等），浏览器会将新样式赋予给元素并重新绘制它，这个过程称为重绘。引起回流重绘调整窗口大小改变字体增加或者移除样式表内容变化，比如用户在input框中输入文字激活 CSS 伪类，比如 :hover (IE 中
2020-06-27 17:32:55
105
原创 手写面试题
1、实现newfunction myNew(fn,...args){ var instance = Object.create(fn.prototype) var result = fn.call(instance,...args) return typeof result==='object' ? result : instance}2、递归实现深拷贝function deepClone(source){ const targetObj = source.constructor ===
2020-06-27 17:24:03
100
原创 AJAX
Ajax介绍AJAX 全称为Asynchronous Javascript And XML，就是异步的 JS 和 XML。通过AJAX可以在浏览器中向服务器发送异步请求，最大的优势：无刷新获取数据。AJAX 不是新的编程语言，而是一种将现有的标准组合在一起使用的新方式。XML 可扩展标记语言。XML 被设计用来传输和存储数据。XML和HTML类似，不同的是HTML中都是预定义标签，而XML中没有预定义标签，AJAX的优点可以无需刷新页面而与服务器端进行通信。允许你根据用户事件来更新
2020-06-21 15:39:10
142
1
原创 express搭建服务器
安装npm initnpm i express --save请求参数method: 请求方法url: 请求地址data: 请求参数get请求参数：query： url? + query参数 —> 键值对的形式，多个键值对使用&拼接params:注册路由需要声明占位符请求的时候需要填写实例的参数数据post请求参数：queryparams请求体参数：参数在请求体中获取： req.body请求体参数携带的数据量更大相比get方法的query方式
2020-06-21 14:39:56
181
原创 适配方案
适配方案1. 安装依赖npm install px2rem-loader lib-flexible --save 2. 设置viewport设置: <meta name="viewport" content="width=device-width,initial-scale=1.0"> 1. 说明: 因为默认的布局视口大于视觉视口，如果不设置将导致页面的内容显示非常小 2. 原理: 将980的页面在375的屏幕上完全显示只能缩小980页面中的内容3. 直接设置px问题1
2020-06-17 12:54:09
150
原创 小程序登录流程
服务端server.js:let Koa = require('koa');let KoaRouter = require('koa-router');let jwt = require('jsonwebtoken');let Fly=require("flyio/src/node")let fly=new Fly;// 获取用户唯一标识openId的接口router.get('/getOpenId', async (ctx, next) => { // 1. 获取请求参数co.
2020-06-17 11:29:14
230
原创 koa搭建服务器
安装npm init -ynpm install koa koa-routernpm install nodemon目录server.jsserver.js:let Koa = require('koa')let KoaRouter = require('koa-router')/*koa框架:用来搭建服务器,作用跟express一样koa-router:koa的扩展库,相当于中间建,用来搭建注册路由*///1 生成实例const app = new Koa()co
2020-06-16 12:29:33
982
原创 文本溢出
单行文本溢出white-space：nowrap;over-flow : hidden ;display : block ; text-overflow : ellipsis多行文本溢出display : -webkit-box ; -webkit-box-orient : vertical ;-webkit-line-clamp : 2 ;overflow : hidden ;text - overflow : ellipsis...
2020-06-12 23:28:48
100
原创 模块化
模块化CommonJSES6 ModuleAMDCMDCommonJS导出:module.exportsmodule.exports = { name: 'module1', add: function (a, b){ return a + b; }}导入：requireES6 Module导出：export / export defaultexport const name = 'tylor';con
2020-05-31 15:33:29
111
原创 webpack面试题
webpack面试题常用的loader常用的plugin优化Loader和Plugin的区别什么是webpackwebpack的基本功能和工作原理bundle,chunk,modulewebpack构建过程模块打包原理热更新原理Babel原理文件指纹代码分割的本质是什么？有什么意义呢？entry,output与gulp、grunt的区别npm打包时需要注意哪些？如何利用webpack来更好的构建？webpack规范常用的loader1、打包less、csscss-loader : 将css文件变成co
2020-05-31 14:23:46
591
原创 webpack配置
webpack基础配置教程1、初识Webpack什么是webpackWebpack是一个模块打包器(bundler)。在Webpack看来, 前端的所有资源文件(js/json/css/img/less/…)都会作为模块处理它将根据模块的依赖关系进行静态分析，生成对应的静态资源五个核心概念Entry：入口起点(entry point)指示 webpack 应该使用哪个模块，来作为构建其内部依赖图的开始。Output：output 属性告诉 webpack 在哪里输出它所创建的 bu
2020-05-30 21:52:33
260
原创 自定义EventBus 与 自定义PubSub
自定义EventBus(function (window) { // 需要向外暴露的事件总线对象 const EventBus = {} // 包含所有监听器函数的容器对象 // 内部结构: {msg1: [listener1, listener2], msg2: [listener3]} let listenersContainer = {} /* 用来绑定监听的on方法 eventName: 事件名 listener: 监听回调函数 */ EventBus.on = functi
2020-05-29 21:21:42
633
原创 移动项目解析（外卖）
项目的初始化使用@vue/cli创建项目 vue -V vue create webapp npm run serve添加vue.config.js配置文件,对脚手架的环境进行一些配置module.exports={ lintOnSave:false, devServer:{ open:true } }安装哈士奇 & git操作npm i husky -D定义git的钩子: 修改package.json文件 "hu
2020-05-29 10:30:21
166
原创 VUE——组件间通信
组件间通信组件间通信的基本原则props : 父 ——> 子非函数属性(对象/数组/基本类型)函数属性自定义事件（$emit） : 子 ——> 父全局事件总线---任意组件间通信组件间通信的基本原则不要在子组件中直接修改父组件的状态数据数据在哪, 更新数据的行为(函数)就应该定义在哪数据定义在哪个组件?若多个组件公共一份数据，那么这个数据就定义在他们共同的父组件上更新数...
2020-05-29 10:11:12
210
原创 vue动画
Vue 在插入、更新或者移除 DOM 时，提供多种不同方式的应用过渡效果。vue过渡动画会和 v-show , v-if 相结合使用必须使用 transition 组件将需要过渡动画的元素 包裹起来当元素从显示状态 --> 隐藏状态 我们称为leave状态 vue会给目标元素加上3个classv-leave: 当前这个class vue本身是没有使用的!v-leave-active : 他在整个vue过渡的生命周期中都会有效v-leave-to : 他只有在vue过渡动画的最
2020-05-20 22:07:03
112
原创 vue脚手架2版本——项目启动的流程
windows中快捷键 & dos命令windows + R 调出运行模板 ; 输入 cmd 调出dos窗口（cmd文件:windows环境下的可执行文件）windows + E 调出（我的电脑）资源管理器cls : 清屏操作set : 查看当前windows操作系统的环境变量set name : 查看指定的环境变量set name=val : 设置环境变量(一次性的设置 关掉命令行窗口后 设置就会失效)set name= : 删除环境变量npm相关的命令npm root -g :
2020-05-20 21:14:45
3590
原创 vue源码分析（三）——数据劫持 与 数据绑定
Object1、数据绑定(model==>View):一旦更新了data中的某个属性数据, 所有界面上直接使用或间接使用了此属性的节点都会更新(更新)2、数据劫持①. 数据劫持是vue中用来实现数据绑定的一种技术②. 基本思想: 通过defineProperty()来监视data中所有属性(任意层次)数据的变化, 一旦变化就去更新界面3、四个重要对象①. Observer通过过隐式递归调用实现所有层次属性的监视/劫持给data重新定义属性, 添加 setter / getter为
2020-05-17 12:04:17
373
原创 vue源码分析（二）——模板解析
模板解析模板解析的关键对象: compile对象模板解析的基本流程:①. 将el的所有子节点取出, 添加到一个新建的文档fragment对象中②. 对fragment中的所有层次子节点递归进行编译解析处理 - 对插值文本节点进行解析 - 对元素节点的指令属性进行解析 &nbs
2020-05-17 10:24:35
201
原创 vue源码分析（一）——数据代理
数据代理data 对象中的所有属性的操作（读/写）由vm对象来代理操作，这样操作data比较方便const vm = new MVVM({ data: { name: 'tom2' }}) 原本的读写方式：vm._data.name = '张三' //写console.log(vm._data.name) //读现在的读写方式：vm.name = '张三' //写console.log(vm.name) //读实现：1、通过Object.define
2020-05-17 10:22:38
129
原创 移动端事件
触屏事件touchstart、touchmove、touchendeventevent.changeTouches : 触发当前事件的手指列表event.targetTouches : 触发当前事件元素上的手指列表event.touches : 触发当前事件屏幕上的手指列表默认行为移动端要禁止所有的默认行为，包括长按选中效果，右击菜单事件，a标签点击跳转事件，滚动条事件 … …e.cancelable() : 判断某默认行为是否可以被阻止e.preventDefault() : 阻止默认行
2020-05-15 12:58:25
153
原创 vue面试题整理
1 对于MVVM的理解Model 代表数数据层，在Vue中指的是 data属性View 代表视图层，在Vue中指的是 htmlViewModel 代表视图模型层，ViewModel 通过双向数据绑定把 View 层和 Model层连接了起来，在Vue中指的是vue的实例2 请详细说下你对vue生命周期的理解1、初始化显示beforeCreate(): 不能通过this读取data中的数据在beforeCreate阶段，vue实例的挂载元素el和数据对象data都为undefined，还未初始
2020-05-14 16:51:58
795
原创 移动端适配方案
不适配<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no,minimum-scale=1.0,maximum-scale=1.0">要设置 meta 标签，将 css像素 = 设备独立像素针对不同的分辨率，要对设计稿中的位图像素，进行相应的缩小，得到我们应该写的px数。例如：分辨率为2的设备，设计稿中的位图像素是6px,那么我们写css标签的值时要写成3px分辨率为
2020-05-13 22:33:00
114
原创 移动端基本概念
移动设备/屏幕屏幕尺寸屏幕尺寸指的是屏幕对角线的长度，单位是英寸，1英寸 = 2.54厘米。屏幕分辨率屏幕分辨率指的是屏幕横纵向上物理像素点的个数，一般以横向像素*纵向像素来 表示一个手机的分辨率.屏幕像素密度也叫:像素密度或屏幕密度屏幕上每英寸可以显示的像素点的数量，单位是ppi，即“pixels per inch”的缩写。屏幕像素密度与屏幕尺寸和屏幕分辨率有关.普通屏vs高清屏一种具备超高像素密度的液晶屏高清屏和普通屏相比，相同区域的物理像素点数,高清屏是普通屏的4倍物理像素
2020-05-13 18:30:30
262
原创 跨域
JSONP通常为了减轻web服务器的负载，我们把js、css，img等静态资源分离到另一台独立域名的服务器上，在html页面中再通过相应的标签从不同域名下加载静态资源，而被浏览器允许，基于此原理，我们可以通过动态创建script，再请求一个带参网址实现跨域通信。封装jsonp// index.htmlfunction jsonp({ url, params, callback }) { ...
2020-05-07 15:21:23
73
原创 redux / react-redux / redux-thunk 详解
Reduxmini版本redux (没有Action Creators)yarn add redux基本步骤：1、建立redux文件夹，建立store.js，引入redux，创建一个store核心对象如何得到store对象：import {createStore} from 'redux'import countReducer from './count_reducer.js...
2020-05-07 12:09:45
552
原创 装饰器
配置装饰器语法环境第一步：yarn add @babel/plugin-proposal-decorators 用于解析装饰器语法。第二步：在项目根目录下创建 config-overrides.js，配置一个loader——addDecoratorsLegacy。module.exports = override( addDecoratorsLegacy())第三步：在项目根目录下创...
2020-05-07 11:12:53
112
原创 react脚手架配置代理与路径别名
react脚手架常见配置一、配置代理：简单版配置：package.json中直接添加："proxy": "http://localhost:4000"完整版本配置：(1).下载：yarn add http-proxy-middleware(2).在src目录下创建：setupProxy.js，内容如下： const proxy = require('http-proxy...
2020-05-01 08:34:57
745
原创 shop-client 电商项目详解
源码地址：Detail 组件一、静态页面拆分二、调接口三、动态显示页面数据四、实现缩放轮播图以及点击缩放图显示大图效果思路：缩放轮播图效果可以引入swiper插件，注意设置在第一次渲染页面后就对skuImageList 进行一次监听(immediate: true)；点击缩放图的图片会添加active的class，因此动态绑定class；设置一个data属性currentInde...
2020-04-23 16:56:49
868
原创 axios使用与源码分析
HTTP相关一、不同类型的请求 GET: 从服务器端读取数据 POST: 向服务器端添加新数据 PUT: 更新服务器端已经数据 （不能接受 query 参数，只能接受 params 参数） DELETE: 删除服务器端数据 （不能接受 query 参数，只能接受 params 参数）query 参数 ： localhost:8080/path?name=xxx&age...
2020-04-23 16:49:01
282
原创 git 基本使用
git 基本使用Git 介绍作用下载安装Linux 常用命令Git常用命令汇总Git 使用起始配置基本操作.git 目录版本库的三个区域历史版本回滚回滚找不到版本号的情况其他回滚（了解）配置忽略文件仓库中没有提交该文件仓库中已经提交该文件分支基本操作创建分支切换分支合并分支删除分支切换并创建分支冲突命令行使用技巧GitHub介绍使用流程本地有仓库本地没有仓库多人合作对同一个仓库进行多人开发账号仓库...
2020-04-09 23:47:29
143
原创 JavaScript（九）：函数防抖和节流
函数防抖和节流前言函数节流（throttle）使用场景函数防抖（debounce）使用场景区别前言一些浏览器事件，window.onresize、window.onmousemove等，触发的频率非常高，会造成浏览器性能问题；如果向后台发送请求，频繁出发，也会对服务器造成不必要的压力。那么如何限制事件处理函数频繁调用呢？就是函数节流和函数防抖函数节流（throttle）函数触发后，会...
2020-04-09 22:13:06
103
原创 编程式路由跳转到当前路由, 控制台抛出NavigationDuplicated的错误
编程式路由跳转到当前路由, 控制台抛出NavigationDuplicated的错误router.push 的语法规则如下：router.push(location（导航路径）, onComplete（成功的回调）?, onAbort?（失败的回调）)router.push(location).then(onComplete).catch(onAbort)router.replace...
2020-04-06 19:33:39
496
原创 Vuex
基本概念Vuex 是状态管理工具。集中式存储管理 应用的所有组件的状态，可以简单的将其看成把需要多个组件共享的变量全部存储在一个对象里面，并将这个变量放在顶层的Vue实例中，让其他组件可以使用。...
2020-04-04 19:27:51
93
原创 JavaScript（八）：继承的七种方式
一、原型链继承、构造函数继承、两者组合继承-原型链继承让父类的实例作为子类的原型，将子类的原型构造器补充完整 （为了让子类继承方法）做法：（1）让子类的原型是父类的一个实例；（2）手动给字类的原型添加构造器function Father(name,age){ this.name = name; this.gender = 'male'; this.num = [...
2020-03-01 22:15:00
100
原创 JavaScript（七）：闭包及相关面试题
如何产生闭包(条件)函数嵌套内部函数引用外部函数的局部变量使用了外部函数（调用了外部函数）闭包是什么理解一: 闭包是嵌套的内部函数(绝大部分人)理解二: 包含被引用变量(函数)的对象(极少数人)理解三： 所谓的闭包是一个引用关系，该引用关系存在于内部函数中，引用的是外部函数的变量的对象(深入理解)常见的闭包将函数作为另一个函数的返回值将函数作为实参传递给另一个函数调用...
2020-03-01 19:08:41
144
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人