- 博客(116)
- 资源 (2)
- 收藏
- 关注

原创 前端面试中级开发必须知道跨域解决方案
跨域不同协议、不同URL、不同端口号都会产生跨域解决跨域的方案:postMessage:web worker、iframeJsonp:用script标签请求地址,标签可以跨域cors: 服务端设置响应头信息,允许跨域1、最常见用cors处理跨域2、如果使用非简单请求,比如PUT和DELETE或者Content-Type字段的类型是application/jsondocument.domin + iframe: 设置同源代理:1、使用webpack-devService2、使用ng
2021-03-03 10:44:12
467

原创 JavaScript数据结构与算法详解
JavaScript数据结构与算法详解一、数据结构1、数组2、栈3、队列4、链表5、集合// 封装集合的构造函数function Set() { // 使用一个对象来保存集合的元素 this.items = {} // 集合的操作方法 // 判断集合中是否有某个元素 Set.prototype.has = function (value) { return this.items.hasOwnProperty(value) }
2021-02-19 11:20:07
385

原创 面试题系列——深思考核内容
面试题系列——深思考核内容一、如何让(a===1&&a=\==2&&a=\==3)的值为true?二、如何实现一个无限累加函数总结一、如何让(a===1&&a===2&&a===3)的值为true?双等号(==):会触发隐式类型转换,所以可以使用 valueOf 或者 toString 来实现。每次判断都会触发valueOf方法,同时让value+1,才能使得下次判断成立。class A { constructor(value)
2020-09-27 11:12:12
749

原创 CSS进阶CSS3,初入前端必备技能之一
CSS进阶CSS3,初入前端必备技能之一一、CSS3是什么?二、使用步骤1.CSS3 边框2.CSS3 背景总结一、CSS3是什么?对CSS3已完全向后兼容,所以你就不必改变现有的设计。浏览器将永远支持CSS2。最重要CSS3模块如下:选择器盒模型背景和边框文字特效2D/3D转换动画多列布局用户界面二、使用步骤1.CSS3 边框border-radius CSS3 圆角div{border:2px solid;border-radius:25px;}box-sha
2020-09-10 17:12:19
439

原创 黑科技偏门实用的js方法总结
黑科技偏门实用的js方法总结一、contains是什么?总结一、contains是什么?使用场景:自定义一个组件,监听每一次点击事件,如果点击到组件以外的区域,则组件隐藏——类似于dialog弹窗的效果原理:每一次点击,都会有捕获和冒泡的阶段,捕获是从html元素向下到点击元素,冒泡阶段是从点击元素向上到html,在这过程中是否有需要的组件dom使用语法://意思判断B中是否包含AB.contains(A)总结good afternoon...
2020-09-02 14:54:18
1949

原创 前端必须掌握的css知识点大全(全)
前端必须掌握的css知识点大全(全)一、CSS是什么?二、使用步骤1.选择器2.CSS 创建3.CSS 背景4.CSS 文本格式总结一、CSS是什么?层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化二、使用步骤1.选择器标签选择器语法:标签名:{}id选择器语法:#id{}cs
2020-08-31 18:15:18
1949

原创 HTML5必须了解掌握的知识点详解(全)
HTML5必须了解掌握的知识点详解()一、html5是什么?二、学习1.为 HTML 添加新元素2.HTML5 新元素总结一、html5是什么?HTML5 是下一代 HTML 标准。HTML , HTML 4.01的上一个版本诞生于 1999 年。自从那以后,Web 世界已经经历了巨变。HTML5 仍处于完善之中。然而,大部分现代浏览器已经具备了某些 HTML5 支持。HTML5 中的一些有趣的新特性:用于绘画的 canvas 元素用于媒介回放的 video 和 audio 元素对本地离线存
2020-08-28 09:57:00
1239

原创 大三毕业设计,从前端到后端到数据库,从pc端web到移动端微信小程序
大三毕业设计,从前端到后端到数据库一、前端vue1.创建一个vue3.0项目2.配置webpack3.创建登录界面login页面二、后端三、微信小程序四、数据库总结一、前端vue1.创建一个vue3.0项目创建的vue3.0项目选择bablevue-routervuexscss(node-loader)2.配置webpack创建vue.config.js代码如下(示例):const path = require('path');const resolve = dir => pa
2020-08-26 21:31:51
3182
2

原创 简单易懂vue组件的生命周期,附带面试题中的vue周期相关题目(百分之八十的几率要问)
简单易懂vue组件的生命周期,附带面试题中的vue周期相关题目(百分之八十的几率要问)一、vue生命周期是什么?二、使用步骤1.整体2.beforeCreate这个阶段几乎没有操作,获取不到data数据,没有$el,已经有了this3.created实例已经被创建,有了data,也可以对data进行计算和监听,这个阶段可以去请求数据,但是没有$el,实例还没有被挂载4.beforeMount这个阶段几乎和created阶段没有差别5.mounted这个阶段已经挂在了$el,dom树,可以获取dom,页面也有
2020-08-24 20:03:21
631
1

原创 必须了解掌握的html知识点(全)
必须了解掌握的html知识点(全)一、HTML是什么?二、学习1.href 和 src 的区别2.html对于大小写不敏感4.html标题6.HTML 文本格式化标签7.html链接总结一、HTML是什么?HTML 是用来描述网页的一种语言。HTML 指的是超文本标记语言 (Hyper Text Markup Language)HTML 不是一种编程语言,而是一种标记语言 (markup language)标记语言是一套标记标签 (markup tag)HTML 使用标记标签来描述网页二、学
2020-08-24 11:17:10
728
1

原创 GitHub命令大全
创建GitHub仓库,gitlab管理分支,将本地仓库上传到Git前言一、GitHub是什么?二、使用步骤1.安装git2.注册GitHub账号3.创建GitHub远程仓库3.将本地的项目上传4.常用git命令总结前言为了有效管理代码,管理项目创建GitHub仓库,gitlab管理分支,将本地仓库上传到Git一、GitHub是什么?GitHub 是通过 Git 进行版本控制的软件源代码托管服务,由 GitHub 公司(曾称 Logical Awesome)的开发者 Chris Wanstrath、
2020-08-18 20:12:48
310
1
原创 研究vue2.0源码(1)initMixin——core
研究vue2.0源码(1)initMixin——core为什么研究源码事情是这样…本来只是一个前端菜鸡(虽然现在也是一个前端大菜鸡(可以菜但是必须得大对不对:))),然后有幸去年参加了一个大项目,就是那种全国性大大项目啊哈哈哈哈,也不用点名点姓说是哪个项目了,就是很大的全国性的,然后触发了程序员的被动技能——工作半年,实际工作时间一年。。。(天天加班)然后吧,每天晚上也没有啥事,就闲来无事的时候脑子一抽(也是恋爱不好谈了,王者荣耀不好玩了)想看vue2.0的源码,(这时候内心就一个想法,你在凝视
2021-04-26 17:54:40
387
原创 no such file or directory, scandir ‘xxxxxnode_modules/node-sass/vendor‘
Syntax Error: Error: ENOENT: no such file or directory, scandir ‘xxxxx/node_modules/node-sass/vendor’一、报错信息Syntax Error: Error: ENOENT: no such file or directory, scandir ‘xxxxx/node_modules/node-sass/vendor’二、解决方案npm rebuild node-sass总结good morni
2021-03-01 10:51:06
1998
1
原创 vue使用slot插槽
vue使用slot插槽前言在 2.6.0 中,我们为具名插槽和作用域插槽引入了一个新的统一的语法 (即 v-slot 指令)。它取代了 slot 和 slot-scope 这两个目前已被废弃但未被移除且仍在文档中的 attribute。新语法的由来可查阅这份 RFC。一、默认插槽// 父组件import defaultslot from "@/study/slot/defaultslot.vue";<template><div><defaultslot>
2020-12-29 11:15:42
299
原创 canvas绘制验证码简单明了
canvas绘制验证码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="
2020-11-23 14:43:00
203
原创 使用cmd命令行装逼,让命令行滚动起来
使用cmd命令行装逼,让命令行滚动起来总结color a扫描当前所有目录dir /s总结good afternoon
2020-10-19 15:17:01
14004
原创 antvG2可视化引擎库,更轻量级的可视化开发选择
antvG2可视化引擎库,更轻量级的可视化开发选择一、G2 可视化引擎二、使用步骤1.引入库2.使用案例1. 创建 div 图表容器2. 编写图表绘制代码三、基础概念概括图形语法交互语法图表组成坐标轴 Axis图例 Legend几何标记 Geometry提示信息 Tooltip图形标记 Annotation总结一、G2 可视化引擎G2 一套面向常规统计图表,以数据驱动的高交互可视化图形语法,具有高度的易用性和扩展性。使用 G2,你可以无需关注图表各种繁琐的实现细节,一条语句即可使用 Canvas 或 S
2020-10-04 11:40:03
1715
原创 VUE内置 HOOKS钩子函数,HOOKS API的Vue实现
VUE内置 HOOKS钩子函数,HOOKS API的Vue实现一、HOOKS二、使用步骤1.withHooks2.useState2.useEffect总结一、HOOKSHook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。后来看到尤大在 Vue 3.0 最近进展 的视频中也提到了 Hooks API,并写了一个在 Vue 中使用 Hooks 的 POC。可以把hooks当作更强、更实用的mixins。二、使用步骤
2020-09-29 16:08:00
2668
原创 VUE3模板,JSX,JSV
JSXJSX1. 变量作用域比较1.1 .vue 中无法使用当前作用域变量,必须return后才能使用1.2 .jsx 中可以直接使用当前作用域的变量2. 灵活性比较2.1 .vue 中一个文件只能写一个组件2.2. .jsx 中可以写多个组件3. 指令比较3.1. .vue 原生支持优雅的指令写法3.2. .jsx 本身不支持指令 社区有多种指令的书写方式,各种千奇百怪,为此还开了issue讨论,至今仍然没有友好的解决方式。因此可以暂时认为 .jsx 不支持指令或支持的不好.4. 运行时性能比较4.1.
2020-09-29 11:02:29
1464
1
原创 资深架构师之路——深入理解JavaScript垃圾回收机制
资深架构师之路——深入理解JavaScript垃圾回收机制一、垃圾回收机制二、为什么使用三、如何使用1、引用计数2、标记清除四、避免垃圾回收1.数组array优化2. 对象尽量复用3.循环优化五、避免内存泄漏1.意外的全局变量2.被遗忘的计时器或回调函数3.闭包4.没有清理的DOM元素引用总结一、垃圾回收机制垃圾回收:js代码想要运行,需要操作系统或者运行时提供内存空间,来存储变量及它的值。在某些变量(例如局部变量)在不参与运行时,就需要系统回收被占用的内存空间,称为垃圾回收内存泄漏:某些情况下,不再
2020-09-27 10:47:21
427
原创 VUE源码解析——全局 API 篇,学习Vue中所有全局API的实现原理
VUE源码解析——全局 API 篇,学习Vue中所有全局API的实现原理学习Vue中所有全局API的实现原理总结学习Vue中所有全局API的实现原理总结good night
2020-09-25 22:09:21
387
原创 a标签的target属性,_blank,_self,_parent,_top,下载任务进度条显示在浏览器的下方,下载文件自动打开关闭
a标签的target属性,_blank,_self,_parent,_top总结_blank:设置target属性值为“_blank”,可以在一个新的窗口中打开链接。_self:设置target属性值为“_self”,会在相同的框架或者窗口中打开链接。*_parent:**设置target属性值为“_parent”,会在父窗口或者包含来超链接引用的框架的框架集中打开链接。我们可以看到原来的Frame_B_1也被新打开的链接覆盖了。_top:设置target属性值为“_top”,会清除所有被包
2020-09-23 10:30:32
1689
原创 JavaScript比较两个对象的值,自定义equal方法
JavaScript比较两个对象的值,自定义equal方法总结定义比较两个对象的方法//比较2个对象是否相同function isObjEqual(o1,o2){ var props1 = Object.getOwnPropertyNames(o1); var props2 = Object.getOwnPropertyNames(o2); if (props1.length != props2.length) { return false; } fo
2020-09-21 22:58:08
1698
原创 使用本地文件创建Web Worker多线程任务,分担复杂的操作,加快操作速度
使用本地文件创建Web Worker多线程任务,分担复杂的操作,加快操作速度一、Web Worker二、使用步骤1.创建worker2.调用worker总结一、Web Workerweb worker 是运行在后台的 JavaScript,不会影响页面的性能。当在 HTML 页面中执行脚本时,页面的状态是不可响应的,直到脚本已完成。web worker 是运行在后台的 JavaScript,独立于其他脚本,不会影响页面的性能。您可以继续做任何愿意做的事情:点击、选取内容等等,而此时 web work
2020-09-21 11:35:35
1532
原创 比较ES6、ES7、ES8常用特性和新特性
比较ES6、ES7、ES8常用特性和新特性一、ES6变量的改变,添加了块级作用域的概念字符串新增方法函数可以像C/C++那样设置默认参数值,增加数据容错能力对象键值对重名简写对象字面量简写提供对象对象合并数据解构和rest参数数据展开PromisecatchallracesetES7求幂运算符(**)Array.prototype.includes()ES8async、await异步解决方案Object.entries()Object.values()字符串填充padStart()、padEnd()总结一
2020-09-20 22:36:40
2522
原创 javascript中while、dowhile、switch、for循环语句
javascript中while、dowhile、for循环语句一、循环语句二、whiledo...whileswitchfor总结一、循环语句一组被重复执行的语句称之为循环体,能否继续重复,决定循环的终止条件。循环结构是在一定条件下反复执行某段程序的流程结构,被反复执行的程序被称为循环体。 循环语句是由循环体及循环的终止条件两部分组成的。二、whilelet a = 1while(a < 10){console.log('a:' + a)a++}do…whiledo{con
2020-09-20 11:50:25
273
原创 Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?Doctype文档类型?
Doctype作用? 严格模式与混杂模式如何区分?它们有何意义?Doctype文档类型?一、Doctype作用?二、严格模式与混杂模式如何区分?三、它们有何意义?四、Doctype文档类型?总结一、Doctype作用?声明位于文档中的最前面,处于 标签之前。告知浏览器以何种模式来渲染文档。二、严格模式与混杂模式如何区分?浏览器解析时到底使用严格模式还是混杂模式,与网页中的 DTD 直接相关。1、如果文档包含严格的 DOCTYPE ,那么它一般以严格模式呈现。(严格 DTD ——严格模式)2、包含
2020-09-19 23:18:17
244
原创 VUE源码解析——内置组件篇,学习Vue中内置组件的实现原理
VUE源码解析——内置组件篇,学习Vue中内置组件的实现原理学习Vue中内置组件的实现原理总结学习Vue中内置组件的实现原理总结good night
2020-09-19 17:35:15
467
原创 VUE源码解析——Object、Array变化侦测原理解析,学习Vue中如何实现数据的响应式系统,从而达到数据驱动视图。
VUE源码解析——Object变化侦测原理解析一、什么是变化侦测?二、Object变化侦测1.Object.defineProperty方法2.依赖收集什么是依赖收集何时收集依赖?何时通知依赖更新?依赖管理器Dep类Watcher类不足之处Object变化侦测流程总结├─dist # 项目构建后的文件├─scripts # 与项目构建相关的脚本和配置文件├─flow # flow的类型声明文件├─s
2020-09-18 11:41:22
377
原创 从浅入深学习TypeScript,通俗易懂——变量声明
从浅入深学习TypeScript,通俗易懂——变量声明一、TypeScript是什么?二、使用步骤1.var 声明作用域规则捕获变量怪异之处 *(常见面试题)let 声明块作用域重定义及屏蔽块级作用域变量的获取总结一、TypeScript是什么?TypeScript 是 JavaScript 的类型的超集,它可以编译成纯 JavaScript。编译出来的 JavaScript 可以运行在任何浏览器上。TypeScript 编译工具可以运行在任何服务器和任何系统上。TypeScript 是开源的。Ty
2020-09-17 20:16:27
472
1
原创 VUE源码解析——模板编译底层原理,学习Vue内部是怎么把template模板编译成虚拟DOM,从而渲染出真实DOM
VUE源码解析——模板编译底层原理一、什么是模板编译?二、整体渲染过程三、模板编译内部流程抽象语法树AST总结一、什么是模板编译?把写在<template></template>标签中的类似于原生HTML的内容称之为模板。在<template></template>标签中除了写一些原生HTML的标签,我们还会写一些变量插值,或者写一些Vue指令,这些东西都是在原生HTML语法中不存在的,不被接受的。render函数会将模板内容生成对应的VNode,VNo
2020-09-17 19:57:44
1435
原创 VSCODE全局背景图片设置教程,background-cover插件
VSCODE全局背景图片设置教程,background-cover插件总结安装插件background-cover找到安装vscode文件路径Program Files\Microsoft VS Code\resources\app\out\vs\workbench搜索workbench.desktop.main.css文件用管理员模式的vscode打开格式化在文件最前端设置总结good afternoon...
2020-09-17 19:45:19
5629
1
原创 VUE源码解析——虚拟DOM,用js对象描述DOM节点,学习什么是虚拟 DOM,以及Vue中的DOM-Diff原理
VUE源码解析——虚拟DOM,用js对象描述DOM节点一、虚拟DOM是什么?二、VNODE类VNode的类型三、VNODE作用总结一、虚拟DOM是什么?虚拟DOM,就是用一个JS对象来描述一个DOM节点如下示例:<div class="a" id="b">我是内容</div>{ tag:'div', // 元素标签 attrs:{ // 属性 class:'a', id:'b' }, text:'我是内容',
2020-09-17 15:50:43
641
原创 JavaScript原型和原型链详解
JavaScript原型和原型链详解一、JavaScript原型什么是原型二、JavaScript原型链什么是原型链什么是prototype和custructor一、JavaScript原型什么是原型在JavaScript中,每当定义一个函数数据类型(普通函数、类)时候,都会天生自带一个prototype属性,这个属性指向函数的原型对象,并且这个属性是一个对象数据类型的值。二、JavaScript原型链什么是原型链在JavaScript中万物都是对象,对象和对象之间也有关系,并不是孤立存在的。对
2020-09-14 22:17:21
434
原创 JavaScript作用域和作用域链详解
JavaScript作用域链详解一、JavaScript作用域JavaScript作用域是什么?作用域范围二、JavaScript作用域链作用域与执行上下文总结一、JavaScript作用域JavaScript作用域是什么?作用域是在运行时代码中的某些特定部分中变量,函数和对象的可访问性。换句话说,作用域决定了代码区块中变量和其他资源的可见性。作用域范围块语句(大括号“{}”中间的语句),如 if 和 switch 条件语句或 for 和 while 循环语句,不像函数,它们不会创建一个新的作用域
2020-09-14 19:44:19
437
原创 以凡人之躯,用js事件监听自定义——写一个绝对定位card组件
以凡人之躯,用js事件监听自定义——写一个绝对定位card组件一、组件是什么?二、使用步骤1.创建组件三、效果总结一、组件是什么?所谓组件化,就是把页面拆分成多个组件,每个组件依赖的 CSS、JS、模板、图片等资源放在一起开发和维护。 因为组件是资源独立的,所以组件在系统内部可复用,组件和组件之间可以嵌套,如果项目比较复杂,可以极大简化代码量,并且对后期的需求变更和维护也更加友好。二、使用步骤1.创建组件html<div class="floatCard" ref="floatCard"
2020-09-13 11:32:49
315
原创 Object原生监听对象变化,类似ES6的proxy代理
Object原生监听对象变化,类似ES6的proxy代理一、监听对象变化二、使用步骤总结一、监听对象变化数据驱动视图的关键点则在于我们如何知道数据发生了变化JS的Object.defineProperty方法二、使用步骤// defineProperty第一个参数是对象,第二个参数是访问对象属性名,第三个参数是get和set操作let car = {}let val = 3000Object.defineProperty(car, 'price', { enumerable: true,
2020-09-12 16:24:37
348
原创 全面的前端依赖库,项目引入dependencies
全面的前端依赖库,项目引入dependencies总结 // antv开头的是阿里的"dependencies": { // G2数据可视化库 // npm install @antv/g2 --save // // import { Chart } from '@antv/g2'; "@antv/data-set": "^0.10.2", "@antv/g2": "^4.0.15", "@antv/g2-plugin-slider": "^2.1.1
2020-09-10 18:09:26
1398
原创 JavaScript前端定时器,异步操作
JavaScript前端定时器,异步操作一、定时器是什么?二、使用步骤1.setInterval()2.setTimeout()总结一、定时器是什么?定时器就是闹钟二、使用步骤1.setInterval()代码如下(示例):setInterval(code,millisec,lang)2.setTimeout()代码如下(示例):setTimeout(code,millisec,lang)setTimeout(function(){alert("Hello")},3000);
2020-09-09 19:53:09
500
最新热门、好看前端vue模板大全
2020-10-05
threejs案例源码.rar
2020-08-24
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人