- 博客(62)
- 收藏
- 关注
原创 Vue.$nextTick你真的懂了吗?
vue的异步刷新是怎么实现的呢?vue.$nextTick你真的懂了吗?什么时候需要用到nextTick呢?
2022-04-10 19:28:25 2439 4
转载 七层网络、HTTP协议
文章目录OSI参考模型---Open System InterconnectionTCP/IP参考模型URL和URI的区别HTTP协议为什么说HTTP协议是无状态协议?http常见状态码HTTP的特点HTTPS协议HTTP和HTTPS的区别HTTPS的加密算法非对称加密对称加密数字证书认证TCP和UDPTCP和UDP应用场景OSI参考模型—Open System Interconnection物理层 :利用物理传输介质为数据链路层提供物理连接。数据链路层 :将IP数据报加头加尾构成帧,通常头部加物理
2022-02-27 09:54:34 1377
原创 浏览器的储存方式总结---cookie、web Storage
会话跟踪技术---Cookie、LocalStorage、sessionStorage
2022-02-25 14:42:56 1143
原创 前端登录和攻击
文章目录前端登录介绍Cookie+Session登录验证过程存在的问题Token登录登陆验证过程Token生成方式特点前端攻击方式xss--跨站脚本攻击xss攻击分类CSRF攻击CSRF攻击攻击原理及过程前端登录介绍Cookie+SessionHTTP 是一种无状态的协议,客户端每次发送请求时,首先要和服务器端建立一个连接,在请求完成后又会断开这个连接。这种方式可以节省传输时占用的连接资源,但同时也存在一个问题:每次请求都是独立的,服务器端无法判断本次请求和上一次请求是否来自同一个用户,进而也就无法判
2022-02-18 21:26:34 1595
原创 Vue插槽
文章目录什么是插槽默认插槽具名插槽作用域插槽什么是插槽插槽就是子组件中的提供给父组件使用的一个占位符,用<slot></slot> 表示,父组件可以在这个占位符中填充任何模板代码,如 HTML、组件等,填充的内容会替换子组件的标签。默认插槽子组件:<template> <div> <h1>中国一流大学:</h1> <slot></slot> </di
2022-02-06 13:43:30 785
原创 React组件通信
文章目录父组件传递数据给子组件子组件传递数据给父组件兄弟组件通讯父组件传递数据给子组件父组件提供要传递的state数据给子组件标签添加属性,值为state中的数据子组件中通过props接收父组件中传递的数据class App extends React.Component {//父组件提供要传给子组件的数据放在state中 state = { lastName: '老王' } render() { return ( <div classNa
2022-02-03 15:41:36 1105
原创 JavaScript异步编程发展史(Promise Demo)
呕心沥血整理的promise demo合集 !任何同学没有看过我都伤心的OK ?什么链式调用、什么all、race、什么await,通通拿下!
2022-01-08 16:59:16 1159
原创 深拷贝和浅拷贝JavaScript
深拷贝和浅拷贝假设B复制了A,当修改A时,看B是否会发生变化。如果B变化了,那么就是浅拷贝;如果B没有变化,则是深拷贝。js数据类型JavaScript的数据类型分为两种:原始类型(即基本数据类型)和对象类型(即引用数据类型);js常用的基本数据类型包括undefined、null、number、boolean、string;js的引用数据类型也就是对象类型Object,比如:Object、array、function、data等;基本数据类型基本数据类型是按值访问的,存放在栈中。就是说我
2022-01-03 18:53:03 986 1
原创 八大排序Javascript(原理+实现)
文章目录插入排序直接插入排序(稳定)思路实现希尔排序(不稳定)思路实现选择排序简单选择排序(不稳定)思路实现堆排序(不稳定)思路实现交换排序冒泡排序(稳定)思路实现快速排序(不稳定)思路实现归并排序思路实现基数排序(稳定)思路实现插入排序直接插入排序(稳定)思路将数组第一个元素看作已经排序好的,按顺序遍历后面的元素,每遍历到一个,将它与已排序好的数组元素比较,插入到正确位置。实现function insertSort(arr){ for(let i=1;i<arr.length;i
2021-12-26 12:56:07 1031
原创 Vue脚手架环境搭建
文章目录一、环境安装1、安装vue2、安装Webpack3、安装Vue脚手架4、vue-cli2.x和vue-cli3.x创建项目的区别(1)vue-cli2.x创建项目(2)vue-cli3.x创建项目二、项目实例1、Header组件部分2、Footer组件部分3、Users组件部分4、App.vue组件部分一、环境安装1、安装vue npm install vue2、安装Webpack npm install webpack -g关于Webpack:是一个开源的前端打包工具。Webpac
2021-12-21 18:21:44 1005
原创 Vue数据及事件绑定
文章目录一、数据绑定1、单向绑定( 1 )插值绑定( 2 )v-bind绑定( 3 )双向绑定二、表单控件绑定1、text(文本框)的绑定2、checkbox(复选框)的绑定3、radio(单选按钮)的绑定4、select三、值绑定1、.lazy(懒加载)修饰符2、.number修饰符3、.trim修饰符四、事件绑定与监听1、方法及内联处理器(1)方法处理器(2)内联语句处理器(3)变量 $event2、修饰符(1)事件修饰符(2)键值修饰符一、数据绑定1、单向绑定 &nbs
2021-12-19 21:16:21 1003
原创 css动画和js动画的比较
文章目录一、css动画1、优点2、缺点二、js动画1、优点2、缺点三、总结一、css动画 CSS3动画的属性主要分为三类:transform、transition以及animation。1、优点浏览器可以对动画进行优化。 浏览器使用与 requestAnimationFrame 类似的机制,requestAnimationFrame比起 setTimeout,setInterval 设置动画的优势主是
2021-11-30 17:17:43 982
原创 浏览器从URL输入到页面展现到底发生了什么?
文章目录一、DNS域名解析过程二、Tcp三次握手建立连接目的过程三、浏览器向服务器发送http请求请求行请求头请求数据四、服务器处理请求并返回http报文状态行响应头响应数据五、浏览器解析渲染页面步骤回流和重绘回流重绘六、 tcp四次挥手断开连接为什么输入url就可以展现对应的页面呢?背后经历了什么?总体为以下几个过程:DNS解析,将域名解析成Ip地址Tcp/Ip三次握手建立连接浏览器向服务器发送http请求服务器处理请求并返回http报文浏览器解析渲染页面tcp四次挥手断开连接一、D
2021-11-09 19:59:31 3281
原创 Js变量到底存储在栈还是堆?闭包呢?
文章目录上级作用域概念JS 堆栈内存释放闭包是什么形成闭包的原因闭包的作用闭包的经典使用场景1:`return`回一个函数2 : 函数作为参数3:自执行函数4:循环赋值使用闭包需要注意什么举例方法一:方法二: 了解闭包前先来了解一下上级作用域和堆栈内存释放问题。上级作用域概念函数的上级作用域在哪里创建创建的,上级作用域就是谁。var a = 10function foo(){ console.log(a)}function s
2021-11-02 16:03:45 1204
原创 React页面路由
前端路由介绍 随着 ajax 的使用越来越广泛,前端的页面逻辑开始变得越来越复杂,特别是单页Web应用(Single Page Web Application,SPA))的兴起,前端路由系统随之开始流行。1、用户的角度 前端路由主要实现了两个功能(使用ajax更新页面状态的情况下):记录当前页面的状态(保存或分享当前页的url,再次打
2021-10-30 14:57:09 683
原创 盒子模型及弹性盒子
文章目录什么是盒子模型盒子模型分类弹性盒子布局容器属性项目属性圣杯布局示例什么是盒子模型 把所有的网页元素都看成一个盒子,它具有以下四个属性:margin—外边距border—边框padding—内边框content—内容盒子模型分类W3C标准盒子模型 标准模式下,box-sizing:content-box; 将采用标准模式的盒子模型标准。一个
2021-10-23 14:53:33 432
原创 React Hooks
一、为什么会有Hooks 介绍Hooks之前,首先要说一下React的组件创建方式,一种是类组件,一种是纯函数组件,并且React团队希望,组件不要变成复杂的容器,最好只是数据流的管道。开发者根据需要,组合管道即可。也就是说组件的最佳写法应该是函数,而不是类。但是我们知道,在以往开发中类组件和纯函数组件的区别是很大的,纯函数组件有着类组件不具备的多种特点:纯函数组件没有状态纯函数组件没有生命周期纯函数组件没有thi
2021-10-11 11:42:13 810
原创 React组件的生命周期
一、什么是生命周期 组件的生命周期就是React的工作过程,就好比人有生老病死,自然界有日月更替,每个组件在网页中也会有被创建、更新和删除,如同有生命的机体一样。 React组件的生命周期可以分为三个过程装载(挂载)过程(mount):就是组件第一次在DOM树中渲染的过程。更新过程(update):组件被重新渲染的过程。卸载过程(unmount):组件从DO
2021-10-08 11:32:28 997
原创 React脚手架、组件基础总结
props属性(1) 每个组件都有props属性(2) 组件的属性值都保存在props中(3) 通过props可以在组件外部向组件内部传递值(4) 在组件内部不能修改props属性的值(5) 在组件内部读取某个属性的值: this.props.属性名(6) 类组件的构造函数constructor(props){ super(props) console.log(props) //输出组件的所有属性 }(7) 设置Props的默认值 组件名.def
2021-09-29 22:11:31 297
原创 浅谈ES6新特性
一、let及const1、ES6新增的两种新的声明格式 let 和const 用于补全ES5标准中var声明变量的不足:在JavaScript中用’var’来声明变量会出现变量提升的情况,即通过"var"声明的变量系统都会把声明隐式的升至顶部,这样的特性往往会让刚接触JavaScript及习惯其他语言的开发人员不适应,导致程序出现问题。2、ES5中定义作用域有两种 &nbs
2021-09-26 17:40:08 173
原创 React简介、JSX语法详解
一、React简介1、是一个JavaScript的库,目的是简化用户界面的开发。2、是基于JSX(JavaScript Xml)语法,可以和html、js混合书写。3、核心是组件,可以实现用户界面的模块化开发,代码的复用率高、可维护性好。4、是Facebook公司开发,2013年发布。二、React的开发过程1、导入js文件<script src="../js/react.development.js"></script> <!-- React的核心库 -->
2021-09-25 22:15:21 390
原创 二叉树的最大(小)深度、前(中、后)序遍历【JavaScript】
由于二叉树独特的树形结构,所以二叉树的很多操作都涉及到递归的方法,从一个根节点映射到很多子节点。二叉树最大深度 求二叉树的最大深度就是,遍历二叉树的左子树和右子树,找到根节点到某一叶子节点的最远距离。 var maxDepth=function(root){ if(root==null){ return 0;
2021-09-14 21:54:34 314
原创 杨辉三角leetcode---js实现
题目描述: 给定一个非负整数 numRows,生成「杨辉三角」的前 numRows 行。在「杨辉三角」中,每个数是它左上方和右上方的数的和。思路描述:杨辉三角的结构其实是一个二维数组。可以将每一层的数据填入之后(每一层第一个和最后一个位置填入1,其他位置符合上一层相邻两元素相加的原则),加到大数组里。代码:var generate = function(numRows) { var last = [] //声明空数
2021-09-08 19:18:57 277
原创 力扣9---回文数(js)
题目描述:给你一个整数 x ,如果 x 是一个回文整数,返回 true ;否则,返回 false 。回文数是指正序(从左向右)和倒序(从右向左)读都是一样的整数。例如,121 是回文,而 123 不是。示例:题目分析:给定一个整数,需要将该整数每一位转置再比较是否相等。此题容易理解,方法也很多。我的方法所涉及的点:1:数字直接转置比较麻烦,先将数字转为字符串,再转为数组。2:数组转置有内置的方法 reverse()。3:再将转置后的数组转为字符串,与输入值所比较。代码:var isPa
2021-09-06 20:13:59 230
原创 Vue基本应用、指令、MVVM和MVC模式
一、前后端分离的架构1、MVVM架构模式 在前端页面中,把Model用纯JavaScript对象表示,View负责显示,两者做到了最大限度的分离,把Model和View关联起来的就是ViewModel。Model:代表数据模型,也可以 在 Model 中定义数据修改和操作的业务逻辑。View:视图,代表 UI 组件,它负责将数据模型转化成 UI 展现出来。ViewModel: 是一个同步 View 和 Model 的对象
2021-09-05 20:29:42 582
原创 55.跳跃游戏--力扣(js)
题目描述:给定一个非负整数数组 nums ,你最初位于数组的 第一个下标 。数组中的每个元素代表你在该位置可以跳跃的最大长度。判断你是否能够到达最后一个下标。示例:思路描述:1、如果输入数组的长度为1,即出发就为终点,直接返回true。2、如何判断能否到达最后一个元素,我采取的方法是,计算出实时能够到达的最远下标,若最后一个元素的下标小于最远下标,那就可以到达最后一个元素。3、如何实时确定最远下标,即当前的i加上第i个位置上的数值。代码:var canJump = function
2021-08-20 18:45:39 234
原创 力扣495---提莫攻击(英雄联盟)
题目描述示例分析1:题目需要输出有效的中毒时间之和,当相邻两次攻击时间点之差(即给定数组中前后相邻的两个数)大于等于攻击一次中毒的时间(即输入的数),有效时间逐次加上duration就OK!2:难点在于,当相邻两次攻击时间点之差小于攻击一次中毒的时间时,会产生重合效果,至于重合多少时间取决于数组前后数字之差和duration的相对大小!3:分析至此,题目思路想必大家已经很清晰!下面附上我的代码!代码var findPoisonedDuration = function(timeSeries
2021-08-12 19:08:45 188 1
原创 多多数字组合(拼多多面试题)JavaScript
多多数字组合(拼多多面试题)给定一个整数N,求一个最小值,要求: (1)各个数位的数字之和等于N (2)各个数位的数字各不相同思路描述: 最小值需满
2021-07-31 22:12:15 302 4
原创 出租车计价JavaScript
题目描述:起步价10元,起步公里数3公里,输入公里数和每公里单价,输出总费用。思路描述: 首先需要对输入公里数进行判断,若小于起步公里数,直接输出起步价10元;若大于起步公里数,再用公里数乘以单价。var basePrice=10;//定义起步价var baseMiles=3;//定义起步公里数function taxiPrice(unitPrice,Mileage){ functi
2021-07-31 21:43:19 1910
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人