自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(24)
  • 收藏
  • 关注

原创 《TypeScript 从入门到深度掌握,晋级TS高手》课程笔记

ts课程笔记合集

2024-03-26 00:54:39 310

原创 《前端面试全家桶,从求职准备到面试演练 2024升级TS》课程笔记

前端知识体系整理

2024-03-26 00:52:39 349

原创 http协议相关、浏览器缓存机制

1.http状态码状态码分类:1xx服务器收到请求2xx请求成功3xx重定向4xx客户端错误5xx服务端错误常见状态码:200成功301永久重定向(配合响应头的location,浏览器自动处理)302临时重定向(配合响应头的location,浏览器自动处理)304资源未被修改 (表示缓存)404资源未找到403没有权限500服务器错误504网关超时2.http methods1.传统的methods: get获取服务器的数据、post向服务器提交数据2.现在的me

2021-05-17 22:46:11 258

原创 webpack相关(未完结)

1.module、chunk、bundle的区别module:各个源码文件,webpack中一切建模块。chunk:多模块合并成的,代码块。如:entry、 import()、 splitChunkbundle:最终输出文件2.webpack性能优化可以从两方面来着手考虑:打包构建速度、优化产出代码打包构建速度:优化babel-loader①开启缓存:?cacheDirectort②明确范围: include 、exclude{ test: /\.js$/, use: ['b

2021-05-12 17:45:09 136

原创 webpack高级配置

1.多入口比如想要输入两个页面:index.html 和 other.html 两个文件分别引入index.js 和 other.js配置entry输入入口配置项:entry: { index: path.join(path.join(__dirname, '..', 'src'), 'index.js'), other: path.join(path.join(__dirname, '..', 'src'), 'other.js') },配置outp

2021-05-11 17:56:48 138

原创 webpack基本配置

1. 拆分配置和merge一般实际项目中会分配多个webpack配置文件,如:webpack.common.js、webpack.dev.js、webpack.prod.js。一个公共配置文件,另外两个分别为生产、线上。具体操作:安装smart插件,npm install smart在生产和线上的webpack配置文件中引入smart插件const { smart } = require('webpack-merge')引入公共配置文件:const webpackCommonConf = req

2021-05-11 17:20:52 107

原创 vdom 时间复杂度O(n^3)优化到O(n)。(diff算法规则)

1.只比较同一层级,不跨级比较2.tab不相同,则直接删掉重建,不再深度比较3.tag和key,两者都相同,则认为是同一节点,不再深度比较

2021-05-11 15:59:11 387

原创 vue2.x 中的数据驱动视图MVVM,原理之一(监听数据变化)——defineproperty

设计思想: 只要触发数据的变动就需要立即触发视图的更新。则需要改造每一个data中的数据,设置访问器属性,每次数据的改动都会被set来接收,因此触发视图更新的步骤就可以在set中实现。具体代码://重新定义数组原型const oldArrayProperty = Array.prototype;const arrProto = Object.create(oldArrayProperty);//创建一个对象,使其继承自Array.prototype。用意在于我们不能直接污染全局的Array.pro

2021-05-05 17:10:19 212

原创 易忘知识点整理(持续更新)——VUE使用

1. 复习组件中自定义v-model指令使用:组件中v-model最基本的用法:在父组件给子组件绑定v-model的时候,相当于绑定了自定义事件@input,v-model=后面传递的值,是子组件在$emit('input', val)时父组件接受的val值,也是转递给子组件的值:自定义v-model的用法:子组件:<script>//在子组件定义model{ prop: 'fatherdata', event: 'custEventName' }export default {

2021-04-21 17:32:15 297

原创 [编程题]树上摘樱桃——网易2021校招笔试-前端开发工程师(正式第一批)

有一棵二叉树,树上的叶子节点定义为“樱桃”。现在需要找出树上有多少个满足如下子结构的“樱桃”串,即一串上刚好有两颗“樱桃”。比如如下的一棵树,红框标示的有两个符合要求的结构,答案就是2又比如下面的这颗树,没有任何符合要求的子结构,则答案是0输入描述:第一行两个正整数m, n,空格分开,分别代表总共有树上有多少个节点,和树上有多少条边,2<=m<=100, 1<=n<=100下面有n行,每行为3个部分,用空格分割,第一个数字为某非叶子节点的id, 第二个为该边为le

2021-01-05 14:56:39 987

原创 寻找两个数组的中位数

给定两个大小为 m 和 n 的正序(从小到大)数组 nums1 和 nums2。请你找出并返回这两个正序数组的中位数。示例 1:输入:nums1 = [1,3], nums2 = [2] 输出:2.00000 解释:合并数组 = [1,2,3] ,中位数 2示例 2:输入:nums1 = [1,2], nums2 = [3,4] 输出:2.50000 解释:合并数组 = [1,2,3,4] ,中位数 (2 + 3) / 2 = 2.5示例 3:输入:nums1 = [0,0], num

2021-01-04 17:23:55 230

原创 给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 的那 两个 整数,并返回它们的数组下标。

给定一个整数数组 nums 和一个整数目标值 target,请你在该数组中找出 和为目标值 的那 两个 整数,并返回它们的数组下标。你可以假设每种输入只会对应一个答案。但是,数组中同一个元素不能使用两遍。你可以按任意顺序返回答案。示例 1:输入:nums = [2,7,11,15], target = 9 输出:[0,1] 解释:因为 nums[0] + nums[1] ==9 ,返回 [0, 1] 。示例 2:输入:nums = [3,2,4], target = 6 输出:[1,2]

2021-01-04 16:32:54 449

原创 关于斐波那契数的两大种方法解

斐波那契数,通常用 F(n) 表示,形成的序列称为 斐波那契数列 。该数列由 0 和 1 开始,后面的每一项数字都是前面两项数字的和。也就是:F(0) = 0 F(1) = 1F(n) = F(n - 1) + F(n - 2) //其中 n > 1①使用递归的方式(解决快,问题复现比较直观,但是性能差不能计算较大的数值): var fib = function(n) { if(n == 0) { return 0; } else if(n == 1)

2021-01-04 15:55:27 194

原创 浏览器默认行为(原生事件)、浏览器中网页渲染顺序

一:浏览器的原生事件1、浏览器中存在一些默认行为,比如:文本可复制、图片可“拖拽”(这是伪拖拽。实际并没有移动,松开鼠标后,会弹出新的链接。)、右键会出现菜单、a标签单击会跳转等。2、为什么要阻止默认行为,如某些时候,我们需要写一个a标签。但是必须达到某个条件后。才会把地址给a标签。实现单击跳转功能,但如果不阻止默认跳转,在刚开始a标签地址的时候,单击,会刷新页面,所以我们需要可以控制这些默认行为。3、如何阻止:①return false;这不仅仅阻止默认行为,还阻止冒泡,下手太狠,万能;②eve

2020-07-13 21:52:45 1234

原创 网页适配相关问题解决

1、在网页头部加上meta标签:<meta name=“viewport” content=" width=device-width,initial-scale=1.0, minimum-scale=0.5,maximum-scale=2.0,user-scalable=yes"/>解释:①meta可以深挖一下,有很多有意思的功能。②width=device-width width为设置layout viewport 的宽度,为一个正整数,”width-device”表示的宽度是设备屏幕

2020-07-13 21:23:09 534

原创 关于BFC(前端常见面试题)

1、什么是BFC?BFC是一块独立的布局环境,保护其中内部元素不收外部影响,也不影响外部。本身BFC是一种css的布局方式,只是我们可以利用它来解决外边距折叠的问题,BFC并不是专门用来解决这个问题而创的;2、如何触发BFC?float的值不是none、position的值不是static或relative 、display的值是inline-block 或 table-cell 或 flex 或 table-caption 或 inline-flex、overflow的值不是visible;3、B

2020-07-09 00:15:02 2007

原创 模块化开发(CommonJS、AMD、CMD、ES6)以及CommonJS与ES6的区别

1.使用匿名函数自调形成闭包来进行模块化开发(无规范)<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"&gt

2020-07-08 23:59:31 359

原创 数组去重⽅法总结

方法一、利⽤ES6 Set去重(ES6中最常用)function unique (arr) { return Array.from(new Set(arr)) }}⽅法⼆、利⽤for嵌套for,然后splice去重(ES5中最常⽤)function unique(arr){ for(var i=0; i<arr.length; i++){ for(var j=i+1; j<arr.length; j++){ if(arr[i]==arr[j]){ //第⼀个等同于第⼆个

2020-07-07 23:38:24 184

原创 Vue的绑定原理(注释版)

包含:选择器属性、闭包、遍历对象、虚拟DOM树、观察者模式、Object.defineProperties()方法改造data中的变量、递归、匿名函数等代码(具体看注释):<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&

2020-07-07 20:42:28 156

原创 Vue当中的观察者模式(observer)

观察者模式: 当一个变量值被修改时,可以自动通知所有关注这个变量的其他对象,自动重新更新获取这个变量的新值。示例代码:<script>//观察者(observer)模式: 当一个变量值被修改时,可以自动通知所有关注这个变量的其他对象,让他们自动重新获得这个变量的新值。var data={ money:1000, setMoney(money){ this.money=money; //只要money被修改,就要调用notifyAll() this.noti

2020-07-07 18:04:16 3324

原创 Vue组件传参(父传子、子传父、兄弟间),以及路由传参

1.父传子①props传参与slot插槽子组件:script脚本中使用props属性接住父组件传过来的值,如:<script>export default { props: ['data1','data2'],//data1,data2表示从父组件传过来的值 name: 'todoItem', methods:{ }, data() { return { } }}</script>template中使用props属性中的值,如:<te

2020-07-06 19:27:49 2860 1

原创 判断一个数组(判断数据类型)

因为typeof在判断的时候无法判断一个数据为对象还是数组,返回的值都是Object,所以罗列了以下几种方法1.instanceof方法instanceof运算符是⽤来测试⼀个对象是否在其原型链原型构造函数的属性代码:var arr = [];arr instanceof Array; //true注意:想要arr instanceof Array为true,得保证arr是由原始Array构造函数创建时才可行。2.Object.prototype.toString.call()这个方法返回

2020-07-06 03:29:41 459

原创 实现深克隆的3种方式:递归调用方式、json方法、jQuery中的$.extend、

浅克隆:只克隆第一级属性,如果某个属性又是一个内嵌子对象,不会进去子对象中克隆子对象的内容。深克隆:既可以克隆第一级属性,如果某个属性又是一个内嵌子对象,不会进去子对象中克隆子对象的内容。代码://封装的克隆方法(递归调用)function deepClone(oldObj){ if(oldObj == null){ return null; } if(typeof oldObj !== "object"){ return oldObj; } var newObj

2020-07-06 01:53:32 412

原创 关于使用token(Vue)

1.服务器端安装jsonwebtoken2.服务器端使用OpenSSL,安装OpenSSL(用来生成和使用私有秘钥和公有秘钥)具体操作:将openssl的安装路径添加到系统环境变量中:C:\Program Files\OpenSSL-Win64\bin在对应的项目文件的node_modul文件夹下创建pem文件夹,在该路径下执行以下命令生成私钥: openssl genrsa -out rsa_private_key.pem 1024用私钥生成公钥:openssl rsa -in rsa_p

2020-07-05 15:08:20 181

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除