qq_46138057的博客

原创 Port “1212“ on “localhost“ is already in use.运行前端项目提示端口号被占用

端口号被占用的问题解决

原创 在react项目中配置less

配置less

原创 操作系统之进程和线程

进程一个应用程序，总是通过操作系统启动的，当操作系统启动一个应用程序时，会给其分配一个进程一个进程拥有独立的、可伸缩的内存空间，原则上不受其他进程干扰进程之间是可以通信的，只要两个进程双方遵守一定的协议，比如ipcCPU在不同的进程之间切换执行虽然一个应用程序在启动时只有一个进程，但它在运行的过程中，可以开启新的进程，进程之间仍然保持相对独立如果一个进程是直接由操作系统开启，则它叫做主进程如果一个进程B是由进程A开启，则A是B的父进程，B是A的子进程，子进程会继承父进程的一些信息，但仍然保持相

原创 XSS攻击

XSS攻击和防御XSS：Cross Site Scripting 跨站脚本攻击存储型XSS恶意用户提交了恶意内容到服务器服务器没有识别，保存了恶意内容到数据库正常用户访问服务器服务器在不知情的情况下，给予了之前的恶意内容，让正常用户遭到攻击反射型恶意用户分享了一个正常网站的链接，链接中带有恶意内容正常用户点击了该链接服务器在不知情的情况，把链接的恶意内容读取了出来，放进了页面中，让正常用户遭到攻击DOM型恶意用户通过任何方式，向服务器中注入了一些dom元素，

转载 CSRF攻击

CSRF 特点和原理CSRF：Cross Site Request Forgery，跨站请求伪造本质是：恶意网站把正常用户作为媒介，通过模拟正常用户的操作，攻击其登录过的站点。它的原理如下：用户访问正常站点，登录后，获取到了正常站点的令牌，以cookie的形式保存用户访问恶意站点，恶意站点通过某种形式去请求了正常站点（请求伪造），迫使正常用户把令牌传递到正常站点，完成攻击防御cookie的SameSite现在很多浏览器都支持禁止跨域附带的cookie，只需要把cookie设置的S

原创 相等（==）与 全等(===)

== 和 === 表示的是不同的含义。1.在使用 == 进行比较时，两个操作数都会先进行类型转换。进行类型转换的时候，如果有一个是数字，一个是字符串，那么会将字符串转换成数字再进行比较，和顺序无关；如："5" ==5,会先把"5"转换成5。然后再进行比较，返回true。如果有一个操作数是布尔值，那么也是转换为数值再比较，false转换为0，true转换为1。如：false == 0,返回的就是true。如果有一个是对象，另一个不是，那么会调用对象的valueOf()方法取得原始值，再根据前面的规则进行比

原创 函数内部--arguments、this、caller、new.target

概述arguments和this是ES5里面函数内部两个特殊的对象；caller是函数对象上的一个属性，也是ES5添加的这个属性；new.target是ES6新增的，用来检测函数是否使用new关键字调用；argumentsarguments是一个类数组对象，包含调用函数时传入的所有参数，这个对象只有以function关键字定义函数时才会有（因此箭头函数就没有这个对象）。arguments对象有一个属性：callee，这个属性是一个指向arguments对象所在函数的指针。function fac

转载 CSS中块级元素和行级元素

原文请点击这里

转载 CSS中可以继承的属性

原文在这

原创 Web Storage(localStorage&sessionStorage)

Web StorageWeb Storage的目的是解决通过客户端存储不需要频繁发送回服务器的数据时使用cookie的问题Web Storage规范最新的版本是第2版，这一版规范主要有两个目标：（1）提供在cookie之外的存储会话数据的途径（2）提供跨会话持久化存储大量数据的机制localStorage和sessionStorage是Web Storage的第2版定义的两个对象。local是永久存储机制，sessionStorage是跨会话的存储机制。这两种浏览器存储API提供了在浏览器中不受页

原创 cookie和session优缺点对比总结

上一篇写了cookie详解，这篇对比列举一下cookie和session的优缺点以及再学习一下session。cookie的优缺点优点缺点存储在客户端，不占用服务器资源只能是字符串格式,存储量有限，数据容易被获取篡改，容易丢失session首先，和cookie相比较，session是存储在服务器端的。优点缺点可以是任何格式，存储量理论上是无限的，数据难以被获取、篡改、不易丢失占用服务器资源session的优点很多，但是它的缺点也是可以引起很大的

原创 cookie的作用组成以及使用

cookie在我们第一次登录某个网站的时候，需要输入账号密码，登录成功之后，服务器会给客户端一个身份凭证，这些身份凭证就是cookie。在再次访问这个网站的时候，浏览器会将这个cookie附带到请求当中，就不需要再次输入账号密码来进行验证了。cookie在访问不同的网站的时候，它会根据记录的信息自动出示不同的身份凭证。cookie的组成：key ：键–可以理解为这个cookie的名字value：值–相当于一个身份编号domain：域–表示cookie属于哪个网站path：路径–表示cookie属

原创 必会算法之链表逆序

先简单说一下链表的特点：链表在空间上不是连续的每存放一个值，都要多开销一个引用空间(即next)每一个节点都认为自己是根节点只要内存足够大，就能存的下，不用担心空间碎片的问题（数组就必须需要一整个连续的空间来存储）链表逆序思路：改变next的指向（1）先定义一个链表：function Node(value){ this.value = value; this.next = null;}let node1 = new Node(1);let node2 = new N

原创 Vue之虚拟dom

什么是虚拟dom虚拟dom本质上是一个普通的js对象，用于描述视图的页面结构。在vue中，每个组件都有一个render函数，每个render函数都会返回一个虚拟dom树，所以，每个组件都有一个虚拟dom树。虚拟dom的作用真实dom的创建、插入、更新等操作会带来大量的性能损耗，降低渲染效率。在每次需要重新渲染时，调用render函数，生成虚拟dom，用新树和旧树对比，找出最小更新量，更新必要的虚拟dom节点，然后修改真实dom。...

原创 Promise

其实之前对promise的理解真的是完全不成体系的，上次有被问到promise解决了什么问题还有promise的应用场景，回答的感觉太简单了，还有一个就是问了await和async。这个也不咋清楚其实。所以今天从头到尾梳理一遍promise的相关问题。给一段代码让判断输出顺序（包括promise,settimeout这些）应该没什么问题⑧~等下找个之前的例子写一下输出结果。...

原创 undefined和null的区别

undefined && null其实我也不知道为什么会有这个问题，不知道哪次看到了这个问题，虽然我自己觉得他们没什么关系，但是我发现要是等我面试被问到，我也答不出个所以然，因此就稍稍总结一下。首先，在undefined和null，它们的布尔值都是false,而且，undefined值是由null值派生而来的，因此它们被定义为表面相等。console.log(undefined == null)//trueundefined和null在语义和用途上都是不同的，所以我觉得其实没什么联

原创 var let const声明变量的区别

之前一直觉得这个自己可以回答上来，…呵呵呵，原来这么一个小小的知识点我都是模棱两可的，害，学习这个东西吧，模棱两可真的是最可怕的，这也是我最容易犯的一个错误，总觉得自己大概会，其实遇到具体的问题就开始ran了hhh。所以，还是不能忽略基础知识的，没有一块块小砖，怎么盖成大房子呢，对吧。所以我遇到小小的知识点，也要养成写到博客上的好习惯，因为我发现写博客真的很有用，因为写到自己的博客上面，是用自己的理解和记忆的方式来进行学习的，而且学习过很容易就会忘掉，记到自己的博客上面，查起来真的也会方便很多很多。关于

原创 正则表达式

首先，我们给一个字符串，以这个字符串作为例子来验证正则表达式的作用以及正确性:下面是我随便写的一个字符串:let str = ' 123aA _ hhh'匹配字符串里面所有数字 let reg = /\d/g //要是没有后面的g，就只会匹配一次，即结果就会是1console.log(str.match(reg).join(''))//123匹配2位数字 {}表示长度 {2,7}表示2到7个let reg = /[0-9]{2}/gconsole.log(str.mat

原创 js数组去重

总结一波数组去重的几种方法：我自己现在一共写了3种：第一种：通过数组的includes方法来判断let arr = [2,3,4,4,3,{},{},NaN,NaN]let arr1 = [];arr.forEach(function(value,index){ if(!arr1.includes(value)){ arr1.push(value) }})console.log(arr1)//[2,3,4,{},{},NaN]可以看出，使用这种方法去重的话，

原创 OSI七层网络模型

OSI模型七个层次及其功能：层次从下往上层次从下往上功能物理层利用传输介质为数据链路层提供物理连接，负责处理数据传输并检测传输的误码率，以便实现数据流的透明传输数据链路层在物理层提供的服务基础上，在通信实体之间建立数据链路连接，传输以帧为单位的数据包，并采用差错控制与流量控制方法，将有差错的物理线路变成无差错的数据链路。网络层为以分组为单位的数据包通过网络选择合适的路径，实现路由选择、分组转发与拥塞控制功能。传输层为用户提供可靠的端到端（end-to-end

原创 js 数组常用的方法

面试要是问：数组常用的方法有哪些？我真的觉得我要是再回答不好我就是个傻子了害reverse:逆序 会改变原数组sort：排序，也会改变原数组，arr.sort()在排序的时候，不是按照我们数学中的大小来排序的，它是按照字符串编码来进行排序的，比如111和12,12会大于111,因为第一位一样，比较第二位，2比1大，就不用继续比了，那么12就会大于111。但是通常我们希望排序之后的顺序是按照数学里面的。那么我们就可以使用下面的方法：var arr = [1,21,28,12,111,10]var a

原创 Vue的生命周期

1.首先，创建实例，设置一些私有属性到实例中。运行生命周期钩子函数beforecreate2.将处理属性（对象变为响应式对象）、comouted、methods、data挂载到实例当中。运行生命周期钩子函数created3.生成render函数。运行生命周期钩子函数beforeMount。4.创建一个watcher,传入函数updateComponent,该函数会运行render,把得到的vnode再传入_update函数执行。在执行render函数的过程中，会收集所有依赖，将来依赖变化时会重新运.

原创 vue之v-model

v-model是一个语法糖，最终会生成一个属性和一个事件。作用于表单元素根据表单元素的类型生成合适的事件和属性。例如：作用于普通文本框：生成value属性和input事件作用于单选框或者多选框：生成check属性和change事件作用于组件默认情况下，生成value属性和input事件属性和事件也是可以改变的：通过model配置：// Compconst Comp = { model: { prop: "number", // 默认为 value event:

原创 Vue 组件间的通信方式

父子间通信propeventstyle classattributenative修饰符$listenersv-modelsync修饰符$parent $children$ref跨组件通信provide和injectroutervuexstoreeventbus

原创 http和https协议

http协议超文本传输协议。首先，http协议是应用层协议。是基于请求与响应，无状态的协议。所有的www文件都必须遵守这个标准。特点无状态：对客户端没有状态存储，对事物处理没有“记忆”能力无连接：每次请求需要tcp三次握手四次挥手重新建立连接基于请求和响应：由客户端发出请求，服务器响应简单、快速、灵活通信使用明文，请求和响应不会对通信方进行确认、无法保证数据的完整性https协议基于http协议，通过SSL和TLS提供加密处理数据、验证对方身份以及数据完整性保护。特点内容加密：采

原创 css中position的取值及区别

static指定元素使用正常的布局行为，即元素在文档常规流中当前的布局位置。relative相对定位。保留原来位置进行定位，相对于自己原来的位置进行定位。absolute绝对定位。脱离原来位置进行定位。相对于最近的非static祖先元素定位。要是没有有定位的父级祖先时，就相对于文档定位。fixed固定定位。相对于屏幕视口进行定位。元素的位置在屏幕滚动时不会改变。sticky粘性定位。可以被认为是相对定位和固定定位的混合。元素在跨越特定阈值前为相对定位，之后为固定定位。须指定 top, r

原创 CSS伪类和伪元素以及选择器的权重

首先，在书写上：伪元素既可以使用：：，也可以使用：。但是伪类呢，只能使用一个冒号 ：。权重伪类选择器的权重大于伪元素选择器。伪类选择器的权重和class,属性选择器相同，伪元素选择器的权重和标签选择器的属性相同。在这里附加一个css选择器的权重知识当权重一样时，后面的会覆盖前面的。显示后面的结果。1000和100不是10进制的100和10是256进制选择器权重!importantInfinity(无穷大)行间样式1000id100class,属性，

原创 Get和Post请求的区别

post和get方法有什么区别？答：要确定基于什么前提，在不同的前提下有不同的答案。(1)如果什么前提都没有，也就是不用考虑任何规范限制的话，只考虑语法来说，这两个方式是没有任何区别的，只有名字不一样。(2)如果是基于RFC的，要看是基于RFC理论的，还是基于具体的实现的。A:如果是基于RFC理论的，我们称这个为Specification。那么Get和Post是具有相同的语法，但是不具备相同的语义，Get方式用作获取信息，Post方式用作发送信息。B：如果是基于RFC的具体的实现的，我们称之为im

原创 常见的状态码

200完成请求200：当浏览器要发送的内容被服务器端接收并处理之后，得到服务器返回的消息。代表完成了一次HTTP请求。30x系列重定向301：永久移动。302：临时重定向。303：临时重定向。必须使用GET请求。304:当浏览器多次访问同一个资源的时候，如果第一次请求的结果还在缓存，还没有过期，那么再次访问这个资源的时候，为了减少网络传输的消耗，如果这个资源没有被修改过，就可以让浏览器继续使用之前缓存的内容，就不需要再将资源发送一遍了，就减少了很多的网络开销。可以理解为，服务器将请求重定向到浏

原创 关于闭包的一点点概念

为什么会形成闭包呢？当内部函数被保存到外部的时候，就会生成闭包。也就是说，当有函数嵌套时，里面的函数被保存到全局，就会产生闭包。闭包带来的影响导致原有作用域链不释放，造成内存泄漏(其实是指由于产生闭包，导致内存被占用，可用的内存减少了，可以看作是内存泄漏）。闭包的作用实现共有变量可以做缓存可以实现封装，属性私有化模块化开发，防止污染全局变量有一个下面的这种例子，我觉得是非常经典滴闭包问题了。function test(){ var arr = []; for(va

原创 DNS域名解析过程

当我们输入url按回车之后，会发生什么呢？这是今天睡前写的最后一篇小笔记啦嘿嘿。首先，当然就是DNS，也就是我们的域名解析系统将域名转换为ip地址（类似于119.75.217.109这种的）啦，域名，也就是一个网址，类似于www.baidu.com这种的，域名其实可以看作是把ip地址转化成了方便我们记忆和认识的方式，而在网络中，是要先知道域名对应的ip地址，才可以进行下一步的传输滴！在域名解析的过程中，是以一种迭代查询的方式来解析ip地址的。主要分为以下几步：首先，现在本地的浏览器缓存进行查找，要

原创 原型和原型链

原型 隐式原型 原型链所有对象都是通过new函数创建的。其实所有的函数都属于对象。原型：prototype每个函数都有一个属性：prototype。prototype也是一个普通的Object对象，每个prototype都有一个属性：constructor，constructor也是一个对象，指向构造函数本身。隐式原型：proto每个对象都有一个属性：proto。__proto__指向创建该对象的构造函数的原型。举个栗子：function A(){}//这是一个函数Avar a = ne

原创 js数据类型

ES5中，一共有6种数据类型，其中有5个原始值，1个引用值，原始值分别是：Number,String,Boolean,undefined,null引用值：Object，Object包含了function,Array等ES6新增了一个数据类型：Symbol，设计的初衷是为了给对象设置私有属性，每次调用Symbol函数得到的符号永远不相等，无论符号名是否相同。还有一个新增的是BigInt,它可以表示任意大的整数。...

原创 浏览器与服务器断开连接：四次挥手

四次挥手目的：数据发送完之后，浏览器和服务器断开连接第一次挥手：浏览器告诉服务器，数据发送完了第二次挥手：服务器告诉浏览器，知道信息发送完了，但是这个时候，服务器还没有接收完数据。第三次挥手：服务器告诉浏览器，数据接收完了。第四次挥手：浏览器知道服务器接收完信息，可以断开连接了。...

原创 浏览器与服务器建立连接：三次握手

三次握手目的：确认浏览器和服务器都有接收信息和发送信息的能力第一次握手：浏览器向服务器发送请求，请求建立连接。可以确认浏览器能够发送消息。SYN=1（表示请求建立连接），seq=n(表示发出信息的序列号）；第二次握手：服务器接收到浏览器的请求后，会对浏览器做出响应。可以确认服务器有接收和发送信息的能力。在接收到浏览器的请求之后，SYN=1(表示同意建立连接），ack=n+1(ack表示接收到的信息的序列号，也就是收到信息的seq+1),seq=x(服务器向浏览器做出响应发送信息的时候，自己也会有序

原创 使用AJAX发送网络请求

使用AJAX发送网络请求AJAX定义AJAX发送网络请求的步骤1.创建XMLHttpRequest对象2.向服务器发送请求3.服务器响应4.onreadystatechange事件AJAX定义AJAX：Asynchronous JavaScript and XML,即异步的js和xml。通过在后台与服务器进行少量数据交换，使网页实现异步更新。也就是可以在不重新加载整个网页的情况下，对网页的某部分进行更新。AJAX应用程序与浏览器和平台无关AJAX发送网络请求的步骤1.创建XMLHttpReques

原创 ES6事件循环

事件循环JS引擎对事件队列的取出执行方式，以及与宿主环境的配合，称之为事件循环。JS运行的环境称之为宿主环境浏览器宿主环境中包含5个线程:JS引擎:负责执行执行栈的最顶部代码GUI线程:负责渲染页面事件监听线程:负责监听各种事件计时线程:负责计时网络线程:负责网络通信事件队列在不同的宿主环境中有所差异，大部分宿主环境会将事件队列进行细分。在浏览器中，事件队列分为两种:1.宏任务(队列): macroTask,计时器的回调，事件的回调，http等绝大部分异步函数进入宏队列。2.微任务

原创 dl dt dd标签

原创 JavaScript作者

js作者 Brendan Eich

原创 主流浏览器内核

浏览器 内核IE tridentFirefox GeckoGoogle chrome Webkit/blinkSafari WebkitOpera presto