- 博客(84)
- 收藏
- 关注
RSS订阅
原创 前端面试题大全（vue、es6、html、css、js）
1、既然Vue通过数据劫持可以精准探测数据在具体dom上的变化，为什么还需要虚拟DOM diff呢？
2020-07-19 17:51:34
5052
原创 JavaScript----循环遍历
JavaScript中的循环遍历数组遍历方法1、forEach()forEach() 方法用于调用数组的每个元素，并将元素传递给回调函数。数组中的每个值都会调用回调函数。其语法如下：array.forEach(function(currentValue, index, arr), thisValue)该方法的第一个参数为回调函数，是必传的，它有三个参数：currentValue：必需。当前元素index：可选。当前元素的索引值。arr：可选。当前元素所属的数组对象let arr
2021-10-19 14:25:03
306
1
原创 JavaScript---原型
原型原型什么时候产生的？执行函数定义的时候，prototype 显示原型就创建出来了，由于函数本身也是对象（实例对象），里面的隐式原型proto也产生了原型的理解原型就是对象，JS 中原型一共有两个，一个是 prototype，一个是proto属性prototype：浏览器的标准属性，程序员使用的，显示原型，存在于函数中__proto__：浏览器的非标准属性，浏览器使用的，隐式原型，存在于实例对象中函数中有 prototype,实例对象中有proto实例对象也是对象，里面就有pro
2021-10-18 16:06:29
517
原创 JavaScript---对象
对象谈谈你对面向对象的理解面向对象：是一种编程思想。提出需求，抽取出对象，调用对象相关的属性或者方法。抽取出对象及特征和行为，通过代码实现对象调用对应的属性和方法、特征---->属性,行为—>方法,对象的类型---->类(类别)对象：看得见，摸得到，具体特指的某个东西。（不是指类别）,具有属性或者方法，特指的某个事物面向对象的特性：封装、继承、多态，(抽象性)// 先定义手机对象的类型(通过构造函数来定义,通过new构造函数,来实例化对象)// 构造函数function
2021-10-18 15:57:52
136
原创 axios的二次封装
axios二次封装额外的让axios发请求时，具有其他功能配置基础路径和超时限制添加进度条信息 nprogress返回的响应不再需要从data属性当中拿数据，而是响应就是我们要拿的数据统一处理请求数据，具体请求也可以选择处理或不处理//创建一个新的实例const service = axios.create({ baseURL:'/api',//当前项目当中所有接口路径的公关路径部分，基础路径 timeout:10000,//当ajax请求超过设置的这个时间则超时});
2021-09-05 19:23:50
270
原创 理解LHS和RHS
这里举一个简单的例子console.log(a)在这段代码中，a就是进行RHS查询，因为我们并没有对a进行赋值操作，而是直接引用了a，我们需要查找并拿到a的值才能传递给console.log如果a=2，这里对 a 的引用则是 LHS 引用。LHS 和 RHS 的含义是“赋值操作的左侧或右侧”并不一定意味着就是“= 赋值操作符的左侧或右侧”。说白了就是变量出现在复制操作的左边是进行LHS查询，出现在右边就是进行RHS查询.赋值操作还有其他几种形式，因此在概念上最好将其理解为赋值操作的目标是谁
2021-09-01 18:56:46
670
原创 动态路由设置、nginx简单配置
动态路由1、router.js中写的是路由参数import Vue from "vue";import Router from "vue-router";import Ebook from './views/ebook/index.vue'Vue.use(Router)export default new Router({ routes:[ { path:'/', redirect:'/ebook' }
2021-08-30 21:28:09
1567
原创 项目工程中封装vuex和mixin.js
vuex一、在项目工程里新建一个store文件夹，这里存放的就是要集中管理的一些数据文件。在整个工程中，main.js中要加入导入import store from './store/index'...new Vue({ store, router, render: h => h(App),}).$mount('#app')接下来是对各个文件的介绍：1、index.js是整个vuex的入口文件，相对路径为src\store\index.jsimport Vue from
2021-08-30 21:13:42
261
原创 vue组件的使用（一）---路由
一、路由的设置：跳转另一个组件隐藏另一个组件时在route里设置meta{ path: '/login', component: Login, meta: {//源设置 isHidden: true, } },用v-show使用在组件上<Footer v-show="!$route.meta.isHidden"></Footer>设置meta.isHidden为true时
2021-08-17 18:49:04
1065
原创 深拷贝和浅拷贝
简单数据类型（值类型）：Number，String，undefined，null，boolean，symbol复杂数据类型（引用类型）：function，Array，object， date，math，regexp（正则）区别：如何区分深拷贝与浅拷贝，简单点来说，就是假设B复制了A，当修改A时，看B是否会发生变化，如果B也跟着变了，说明这是浅拷贝，拿人手短，如果B没变，那就是深拷贝，自食其力。深拷贝的方法1、obj2=JSON.parse(JSON.stringify(obj1))缺点：1、
2021-08-13 19:54:09
287
原创 vscode上git出现 fatal: invalid server response； got ‘version 1‘？
https://docs.gitlab.com/ee/administration/git_protocol.html解决办法：git config --global protocol.version 2
2021-07-09 14:48:07
1396
原创 前端框架：VUE
1、Vue 是什么？Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合2、使用Vue将helloworld 渲染到页面上3、指令本质就是自定义属性Vue中指定都是以 v- 开头v-cloak防止页面加载时出现闪烁问题 <style type="text/css"> /* 1、通过属性选择器 选择到 带有属性 v-cloak的标签 让他隐藏
2021-03-08 18:13:31
603
3
原创 读取json数据中对象的key值
前端读取json数据时候，可以使用以下方法读取对象的key值if (network?.win) { for (const key in network.win) { netData1.push(key); } } else { for (const key in network) {
2021-03-01 15:14:13
1341
原创 虚拟列表及其原理
一、什么是长列表？前端的业务开发中会遇到一些数据量较大且无法使用分页方式来加载的列表，我们一般把这种列表叫做长列表。完整渲染的长列表基本上很难达到业务上的要求的，非完整渲染的长列表一般有两种方式：懒渲染：这个就是常见的无线滚动的，每次只渲染一部分（比如10条），等剩余部分滚到可见区域，就再渲染一部分。可视区域渲染：只渲染可见部分，不可见部分不渲染。虚拟列表就是采用的可视区渲染方式优化二、虚拟列表实现原理虚拟列表（Virtual List），是一种长列表优化方案，是可视区渲染列表。其两个重要
2021-02-22 19:57:52
11340
2
原创 CSS hover 蛇边界动画
实现效果：HTML代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet"
2021-02-09 17:10:00
178
1
原创 React（一）
第一章：React入门1、React的特点声明式编程组件化编程React Native编写原生应用高效（优秀的Diffing算法）单向数据流2、React高效的原因使用虚拟（virtual）DOM，不总是直接操作页面真实DOM。DOM Diffing算法，最小化页面重绘。3、相关的js库react.js：React核心库。react-dom.js：提供操作DOM的react扩展库。babel.min.js：解析JSX语法代码转为JS代码的库。4、虚拟DOM与真实DOM
2021-02-08 19:05:18
169
原创 ES6-ES11
第一章 ECMA6新特性1.1 let关键字let关键字用来声明变量，使用let声明的变量有几个特点：不允许重复声明块儿级作用域不存在变量提升不影响作用域应用场景：以后声明变量使用let就对了2.2 const关键字const关键字用来声明产量，const声明有以下特点声明必须赋初始值标识符一般为大写不允许重复声明值不允许修改块儿级作用域注意：对象属性修改和数组元素变化不会出发const错误应用场景：声明对象类型使用const，非对象类型声明选择let1.3 变量的
2021-01-06 16:15:03
256
原创 localStorage时效性
如何设计一个localStorage，保证数据的时效性？localStorageHTML5的本地存储API中的localStorage与sessionStorage在使用方法上是相同的，区别在于sessionStorage在关闭页面后即被清空，而localStorage则会一致保存。localStorage是HTML5本地存储的API，使用键值对的方式进行存取数据，存取的数据只能是字符串。存储方式：以键值对（Key-value）的方式进行存取数据，存取的数据只能是字符串主要应用：购物车、客户登录
2021-01-05 19:55:07
1930
原创 实现规定算法: str = “2[a]1[bc]“,返回“aabc“
这里有一个约定的规则，实现一个方法decodeStr，输入一个字符串，根据约定规则输出编码结果。约定规则如下：// str = "2[a]1[bc]",返回"aabc"// str = "2[e2[d]",返回"eddedd"// str = "3[abc]2[cd]ff",返回"abcabcabccdcdff"// 可以看出：N[string],表示string正好重复N次。假设字符串一定是有效正确的字符串；但是你需要考虑其它可能出现的== 代码实现： ==//主函数var decodeS
2020-12-24 10:50:31
430
1
原创 微服务
什么是微服务，微服务跟单体应用的区别是啥，用微服务有啥好处一、什么是微服务所谓的微服务是SOA架构下的最终产物，该架构的设计目标是为了肢解业务，使得服务能够独立运行。微服务可以按照业务划分，将一组特定的业务划分成一个服务，每个服务都有自己独立的数据库，独立部署，服务肢解通过REST API进行通讯。每一个独立运行的服务组成整个系统。...
2020-12-18 19:59:08
121
1
原创 老鼠识别毒水
有100瓶水，其中有一瓶有毒，小白鼠只要尝到一点有毒的水3天后就会死亡，至少要多少只小白鼠才能在3天内鉴别出哪瓶水有毒？解读每个老鼠只有死或活2种状态，因此每个老鼠可以看作一个bit，取0或1N个老鼠可以看作N个bit，可以表达2^N种状态（其中第n个状态代表第n个瓶子有毒）因此所有老鼠能表示的状态数能大于等于100即可。let n = 1;while (Math.pow(2,n) < 100) {n++;}console.log(n);答案为：7...
2020-12-15 19:48:31
417
原创 图片加载
完善下面函数，实现图片的加载function creatImg(url) {}creatImg(url).then((value) => { document.body.appendChild(value);})让图片有个延迟，一次加载图片的功能：function creatImg(url, delay) { return new Promise((resolve) => { const img = new Image(); img.s
2020-12-11 19:56:04
317
原创 数组排列组合
var arr = [[“A”,“B”],[“a”,“b”],[1,2]] 求二维数组的全排列组合 结果为：Aa1,Aa2,Ab1,Ab2,Ba1,Ba2,Bb1,Bb2var arr = [ ["A", "B"], ["a", "b"], [1, 2], ['G', 'g']];const getResult = (arr1, arr2) => { if (!Array.isArray(arr1) || !Array.isArray(arr2)) {
2020-12-10 18:55:37
416
1
原创 仓储系统-爆仓
实现以个简单的仓储系统，可以不断转入和转出货物，货物最多有两层子类目，数字代表该子类目转入/转出的数量。转出时不能出现爆仓情况。/*cargo 说明：key代表类目/子类目名称value为number时，代表这个类目的数量，为object时，代表下一层货物的集合，最多嵌套两层{ productA:{ //代表货物的类目名称 a:1, //1、代表子类目a 的数量 b:2, c:{ //c代表货物的子类名称 c1:1,
2020-12-09 19:28:52
220
原创 Leetcode算法题
一、排序56. 合并区间给出一个区间的集合，请合并所有重叠的区间。示例 1:输入: intervals = [[1,3],[2,6],[8,10],[15,18]]输出:[[1,6],[8,10],[15,18]] 解释: 区间 [1,3] 和 [2,6] 重叠, 将它们合并为 [1,6].示例 2:输入: intervals = [[1,4],[4,5]]输出: [[1,5]]解释: 区间 [1,4] 和 [4,5] 可被视为重叠区间。提示：intervals[i][0] &
2020-11-24 19:52:25
83
原创 javaScript:堆栈内存、闭包作用域
JS中的数据类型基本数据类型number (NaN, infinity)stringbooleannullundefinedsymbolbigint引用数据类型objectfunction数据类型检测typeof 检测数据类型的逻辑运算符instanceof 检测是否为个类的实例constructor 检测构造函数Object.prototype.toString.call 检查数据类型的typeof [value] 返回当前值的数据类型 "数据类型
2020-10-19 19:37:36
145
原创 前端问题
1、解决模板字符串中不能传递数组、对象这类数组模板字符串中使用的是字符的类型，所以需要将数据使用JSON.parse(jsonstr)方法
2020-09-22 17:52:27
205
原创 解决谷歌浏览器Failed to load resource: net::ERR_FAILED问题
问题描述：使用ajax去访问json文件时，用谷歌浏览器打开时，会出现如下图问题：问题解决：1、出现该问题是因为出现了跨域，可以查找相关解决跨域方法解决2、使用vscode编辑器，安装live-server插件，使用如图方法打开html文件，会强制使其在同一个服务器下。...
2020-08-21 17:18:43
93735
8
原创 javascrip算法题
1、给定一个整数数组和一个目标值。找出数组中和为目标值的两个数。同样的元素不能被重复利用。给定num[2,7,11,15] ,target=9. var num=[2,7,11,15,12],target=13; var twoSum = function(num,target){ var a =[];//创建一个新数组存放遍历过的元素 for(var i=0;i<num.length;i++){ var temp = target - num[i];//找到另外一
2020-07-19 21:00:18
110
原创 javascript基础之继承
实现继承的各种方法：1、传统形式–>原型链缺点：过多的继承了没用的属性2、借用构造函数 -->利用call、apply（不算标准的继承模式）缺点：不能继承借用构造函数的原型每次构造函数都要多走一个函数 -->浪费效率 function Person(name,age,sex){ this.name=name; this.age=age; this.sex=sex; } function Student(name,age,sex,gr
2020-07-11 14:17:49
132
4
原创 javascrip：原型、原型链
原型1、定义：原型是function对象的一个属性，它定义了构造函数制造出的对象的公共祖先。通过该构造函数产生的对象，可以继承该原型的属性和方法。原型也是对象。2、利用原型的特性和概念，可以提取共有属性。3、对象属性的增删和原型上属性增删改查。4、对象如何查看原型。通过隐式属性__proto__5、对象如何查看对象的构造函数。通过constructorObject.prototype --原型Object.prototype=｛｝ --祖先<script type="text/jav
2020-07-09 21:49:58
132
原创 vueX(vue数据驱动)
###今日目标1.Vuex概述2.Vuex基本使用3.使用Vuex完成todo案例###1.Vuex概述Vuex是实现组件全局状态（数据）管理的一种机制，可以方便的实现组件之间的数据共享使用Vuex管理数据的好处：A.能够在vuex中集中管理共享的数据，便于开发和后期进行维护B.能够高效的实现组件之间的数据共享，提高开发效率C.存储在vuex中的数据是响应式的，当数据发生改变时，页面中的数据也会同步更新###2.Vuex的基本使用创建带有vuex的vue项目，打开终端，输入命令：vue
2020-06-17 19:48:54
359
原创 小程序框架之uniapp
uni-app的基本使用基础部分：环境搭建页面外观配置数据绑定uni-app的生命周期组件的使用uni-app中样式学习在uni-app中使用字体图标和开启scss条件注释跨端兼容uni中的事件导航跳转组件创建和通讯，及组件的生命周期uni-app中使用uni-ui库uni-app介绍 官方网页uni-app 是一个使用 Vue.js 开发所有前端应用的框架，开发者编写一套代码，可发布到iOS、Android、H5、以及各种小程序（微信/支付宝/百度/头条/QQ/钉钉）等多
2020-06-08 21:31:37
1721
原创 移动端开发（rem布局）
移动web开发之rem布局rem基础rem单位rem (root em)是一个相对单位，类似于em，em是父元素字体大小。不同的是rem的基准是相对于html元素的字体大小。比如，根元素（html）设置font-size=12px; 非根元素设置width:2rem; 则换成px表示就是24px。/* 根html 为 12px */html { font-size: 12px;}/* 此时 div 的字体大小就是 24px */ div { font-size:
2020-06-04 13:22:08
265
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人