el-form 校验数组的每个元素 当表单的属性为数组时，该怎么校验数组元素的每一项呢？效果图：vue 代码<template> <div style="width: 500px"> <el-form :model="ruleForm" :rules="rules" label-width="100px" ref="ruleForm" > <el-form-item label="书籍推荐" prop="bookR
VSCode插件，TODO标记 VSCode插件推荐： Todo Tree、TODO Height在商店中搜索并安装：使用：默认情况下TODO: ，FIXME: 为高亮提醒的关键字，还可以自定义关键字自定义关键字：在vscode配置文件中设置4. 点击下面这个树一样的标记，就可以找到todo标记过的所有文件，点击就可以直接跳转到被标记的文件啦...
Vue slot插槽的使用 为什么使用slot生活中：插槽的目的是让我们原来的设备具备更多的扩展性比如电脑的USB, 我们可以插入U盘，硬盘、手机、音响、鼠标、键盘等等组件的插槽：也是为了让我们封装的组件更加具有扩展性让使用者可以决定组件内部的一些内容到底展示什么插槽的基本使用显示效果：具名插槽的使用：需求：封装一个导航栏组件，左边、中间、右边都可根据需求显示不同的东西实现：<!-- 定义 --><template id="cpn"> <div>
Vue双向绑定实现原理及代码实现(超详细) Vue双向绑定实现原理及代码实现原理：Vue采用数据劫持结合发布者-订阅者模式的方法，通过Object.defineProperty()来劫持各个属性的setter,getter属性在数据变动的时候，通知订阅者，触发更新回调函数，重新渲染视图数据劫持（Object.defineProperty）当Vue实例上的 data 中的数据改变时，对应的视图所用到的 data中数据也会在页面改变。所以我们需要给 data 中的所有的数据设置一个监听器，监听 data 的改变和获取一但数据改变，监
防抖节流 防抖节流认识防抖节流JavaScript是事件驱动的，大量的操作会触发事件，加入到事件队列中处理。而对于某些频繁的事件处理会造成性能的损耗，可以通过防抖和节流来限制事件频繁发生为什么需要防抖节流为什么需要防抖？举个例子：比如想要搜索一个MacBook：当输入m时，为了更好的用户体验，通常会出现对应的联想内容，这些联想内容通常是保存在服务器的，所以需要一次网络请求；当继续输入ma时，再次发送网络请求；那么macbook一共需要发送7次网络请求；这大大损耗我们整个系统的性能，无论是前端的事
JavaScript深浅拷贝 深浅拷贝什么是深浅拷贝？深浅拷贝是只针对Object和Array这样的引用数据类型的浅拷贝：只进行一层关系的拷贝，如果属性是基本类型，直接拷贝基本类型的值，如果属性值是内存地址，就拷贝这个地址，新旧对象公用一块内存深拷贝：进行无限层次的拷贝，会创造一个一摸一样的对象，不共享内存，修改对象不会互相影响为什么要进行深浅拷贝？let arr1 = arr2 = [1,2,3]let obj1 = obj2 = {a:1, b:2, c:3}arr1[0] = 2obj1.a = 2cons
前端面试——JS进阶 JS进阶1. ES6 基础知识点变量提升问：什么是变量提升？为什么存在变量提升函数及变量的声明都将被提升到函数的最顶部。也就是变量可以先使用再声明。变量提升的根本原因就是为了解决函数之间互相调用的情况。问：变量和函数怎么进行提升的？ 优先级是怎么样的？第一阶段：对所有的函数声明进行提升(忽略表达式和箭头函数)，引用类型的赋值分为三步：开辟堆空间存储内容将地址赋值给变量第二阶段：对所有的变量进行提升，全部赋值为undefined，然后依次顺序执行代码(let和cons
前端面试——JS基础 1 数据类型原始类型StringNumberBooleannullundefinedSymbol引用类型ObjectArrayDateRegExpSymbol问：说说JavaScript中的基本类型有哪些？以及各个数据类型是如何存储的？堆栈池内存栈：存放变量堆：存放复杂对象池：存放常量栈和堆是两种基本的数据结构。栈在内存中自动分配内存空间，堆在内存中动态分配内存空间，不一定会自动释放，在项目中将对象类型手动置为null, 是为了减少无用内存消耗。2 类
改变this指向-call、apply、bind的内部实现 改变this指向-call、apply、bind的内部实现手写call // call 的内部实现 Function.prototype.myCall = function(context) { // 判断调用者是否为函数 if(typeof this !== 'function') { throw new TypeError('Error') } // 不传参默认为 window context = conte
前端面试——HTML5 新特性总结 三 HTML5 新特性总结1. 视频和音频1.1 视频今天，大多数的视频是通过插件(比如Flash) 来显示的，然而并非所有浏览器都拥有同样的插件。HTML5规定了一种通过video元素来包含视频的标准方法。视频格式video元素支持三种视频格式：OggMPEG 4WebM使用方式<video src="movie.ogg" controls="controls"></video><video> 标签的属性<video
前端面试——css篇 css篇1. link 和 @import的区别本质上，这两种方式都是为了加载css文件，但还是存在细微的差别link属于XHTML标签，而@import 完全是css 提供的一种方式。link标签除了加载css外，还可以做很多其他的事情，比如定义RSS，定义rel连接属性等，@import只能加载CSS加载顺序的差别。当一个页面被加载的时候, link引用的CSS会同时被加载，而@import引用的CSS会等到页面全部被下载完再加载。兼容性的差别。由于@import是CSS2.1提出的所以老
前端面试——HTML，HTTP, Web基础篇 一 HTML，HTTP, Web基础篇1. h5 新特性1.1 DOCTYPE有什么用？标准模式与混杂模式如何区分？它们有何意义？告诉浏览器使用哪个版本的HTML规范来渲染文档。DOCTYPE不存在或形式不正确会导致HTML文档以混杂模式呈现。标准模式(Standards mode) 以浏览器支持的最高标准运行；混杂模式（Quirks mode)中页面是一种比较宽松的向后兼容的方式显示。1.2 严格模式与混杂模式的语句解析不同点有哪些1）盒模型的高宽包含内边距padding和边框bor
Vue CLI、Vue Router、Vuex的使用 Vue CLI、Vue Router、Vuex的使用1. vue-cli(vue脚手架)创建项目1.1 关于旧版本Vue CLI 的包名称由 vue-cli 改成了 @vue/cli。如果你已经全局安装了旧版本的 vue-cli (1.x 或 2.x)，你需要先通过 npm uninstall vue-cli -g 或 yarn global remove vue-cli 卸载它。1.2 Node 版本要求Vue CLI 4.x 需要 Node.js v8.9 或更高版本 (推荐 v10
Vuex核心概念 Vuex核心概念vuex的五个核心概念1. StateState单一状态树Vuex提出使用单一状态树，什么是单一状态树呢？英文名称是：Single Source of Truth,也可以翻译成单一数据源也就是只能有一个Store对象,如果将状态信息保存在多个Store对象，之后管理会变得很困难单一状态树能够让我们用最直接的方式($store.state)找到某个状态的片段，而且便于之后的维护和调试2. Getters2.1 Getters基本使用有时候，我们需要从sto
Vue学习(三)—使用脚手架创建工程 Vue学习—2020/8/20传统工程问题兼容性问题使用模块化会导致JS文件增加，从而导致传输文件数增加直接使用原始代码会导致文件体积过大使用第三方库很不方便搜索下载引用js(某些第三方库可能没有ES6模块化版本)vue模板书写在字符串中，没有智能提示，没有代码着色难以把样式代码集成到vue组件中其他诸多细节问题…这些问题的本质是：开发的代码和运行的代码要求不同所以我们需要一个工具，然后通过这个工具转换后，得到一个最合适运行的代码在vue中，这个工具就是vue-cli
JavaScript核心—DOM（一） 1. Web APIs 和 JS基础的关联性1.1 JS 组成ECMAScript：JavaScript语法DOM：文档对象模型BOM：浏览器对象模型1.2 JS 基础阶段以及Web APIs阶段JS基础阶段学习ECMAScript标准规定的基本语法只学习语法做不了常用的网页交互效果JS基础是铺垫Web APIs阶段Web APIs 是W3C组织的标准主要学习DO...
Vue学习(二）—组件核心概念 Vue学习—2020/8/19总结ES6知识补充ES6模块化没有模块化的影响：全局变量污染、难以管理的依赖常见的标准化标准：CommonJS、 ES6 Moudule、AMD、CMD、UMD…导出的几种方式：// 默认导出 {default: fn}， 函数可以是匿名函数export default function (a, b) { return a + b;}// 具名导出(普通导出)，一个js文件只能有一个默认导出，可以有多个普通导出// 普通导出, { double
Vue学习(一)—Vue核心概念 Vue学习—2020/8/18总结ES6知识补充速写属性var name = "abc";var age = 18;var obj = { // 速写属性，当对象中的属性值来自于一个变量，可以简写为如下方式，等价于：name:name,age:age name, age}速写方法var obj = { name:"abc", // 速写方法，等价于sayHi:function() {...} sayHi() { con
ES5中的新增方法 1. 数组方法迭代(遍历)方法：forEach()、map()、filter()、some()、every()array.forEach(function(currentValue, index, arr))forEach() 用于遍历数组currentValue：数组当前项的值index：数组当前项的索引arr：数组对象本身 var arr = [1, 2, 3]; var sum = 0; arr.forEach(function(value, index, arr
ES6—类 1. 构造函数和原型1.1 概述在典型的OOP的语言中(如Java),都存在类的概念，类就是对象的模板，对象就是类的实例，但在ES6之前，JS并没有引入类的概念。ES6，全称ECMAScript 6.0，2015.06发版。在ES6之前，对象不是基于类创建的，而是用一种称为构造函数的特殊函数来定义它们的特征。创建对象可以通过以下三种方式：对象字面量new Object()自定义构造函数 // 1.利用new Object() 创建对象 var obj1 = new Objec
关注
