秋水惊鸿的博客

ES6对JS的对象提供一些封装的语法糖，用来简化某些操作。1.属性值简写给对象添加变量时，同名属性可以简写：let name = "zhangsan"let Obj = { name, test:'lalala'}console.log(name) //zhangsan2.可计算属性可计算属性，可以实现动态属性赋值，动态属性允许是JavaScript表达式，即也可以是有返回值的function。let Person = { [name]:'王五'}console.log(

一、原型原型的作用是什么？在理解原型的作用之前，我们需要先知道一个例子function Person(name) { this.name = name this.sayName = function () { console.log(this.name) }}const p1 = new Person('张三')const p2 = new Person('李四')console.log(p1.sayName === p2.sayName) //false这里我们声明

声明对象1.原型实例化// 声明对象的方式1：原型实例化let obj1 = new Object()obj1.name = 'obj1---张三'obj1.getName = function(){ return this.name}console.log(obj1.getName())2.直接赋值// 声明对象的方式2：直接赋值let obj2 = { name:'obj2---李四', getName(){ return this.name }}co

一、Flex布局是什么？Flex是Flexible Box的缩写，意味“弹性布局”，通过将元素设定为容器，容器内部所包含的子元素称之为Flex项目，也就是容器成员。任何一个容器都可以指定为Flex布局。容器默认存在flex-wrap两根轴，水平的主轴和垂直的交叉轴，项目默认按照主轴排列，即默认按水平排列。.box { display:flex;}<!--行内元素也可以使用flex布局-->.line{ display:inline-flex;}注意：Flex

数据结构——队列数据结构特点队列是遵循先进先出（FIFO，也称为先来先服务）。队列在尾部添加新元素，并从顶部移除元素。最新添加的元素必须排在队列的末尾。常见场景排队买票计算机中的打印队列。JS中的任务队列队列方法enqueue(element(s))：向队列尾部添加一个（或多个）新的项dequeue()：移除队列的第一项（即排在队列最前面的项）并返回被移除的元素peek()：返回队列中第一个元素——最先被添加，也将是最先被移除的元素。队列不做任何变动（不移除元素，只返回元素信息——

什么是Hooks？Hooks是一类特殊的函数，适用于React的函数组件，可以让我们在不编写class的情况下使用state及其他的React特性，比如副作用处理及生命周期等。为什么要Hooks？Hooks主要可以解决以下几类问题：在无需修改组件结构的情况下复用状态逻辑。原来的类组件如果需要封装一段可重用的逻辑，需要使用到高阶组件，不仅增加代码复杂度，同时会增加额外的组件节点。但是采用hooks的话，会更加的简单方便。复杂逻辑分离，针对一些副作用进行了集中的管理，让相关的业务逻辑更加聚合。使得

介绍代码通过 包（package） (或者称为 模块（module）) 的方式来共享，一个项目可能存在依赖于多个包，而yarn就是factbook推出的一款开源的包管理工具。优点快速：安装的时候会将安装的包创建一个本地缓存，以便下次其他项目安装相同包时直接从缓存读取可靠：通过yarn.lock来维护包的版本，从而保证一个项目在不同的环境重新安装包依赖的时候，保证版本的一致。安全：通过算法校验包的完整性。安装官网安装文档：https://yarn.bootcss.com/docs/

Mac常用快捷键表情选择页 ctrl+cmd+space截图 ctrl+cmd+shift+4/shift+cmd+4锁屏 ctrl+cmdf+q全屏/退出全屏 cmd+ctrl+f系统调用快捷键系统偏好设置 cmd+shift+x截图 Command+Shift+Control+4 截取所选屏幕区域到剪贴板，或按空格键仅捕捉一个窗睡眠状态 电源键1.5s/option+cmd+电源键强制关机 长按电源键锁屏 ctrl+cmd+q查找文件及所在目录 cmd+空格，cmd+回车文本编

本文主要总结Webpack的一些常见配置，比如ES6、react、css、图片解析和字体等ES6解析解析ES6需要使用babel-loader来做解析，babel-loader依赖babel，所以也需要单独安装babel和配置babel。安装命令如下：npm i @babel/core @babel/preset-env babel-loader -D //-D 是--save-dev的缩写创建.babelrc配置文件，并配置如下：{ "presets": [ "@babel/pr

前言本文主要简单介绍http协议发展的历史版本以及https的安全机制，对于更多深入协议内层及网络通信相关的知识，在此暂不做总结。何谓Http协议超文本传输协议（Hypertext Transfer Protocol，HTTP）是一个简单的请求-响应协议，俗称HTTP协议。网络传输的层级在网络传输中，Http协议在网络传输中位于应用层，在一次http请求中，从我们输入请求地址之后，数据传输要经历不同层次的包装，添加对应的响应头，中间涉及各种协议，具体如下：层级协议/技术应用层

前言Vue的一大特点就是数据双向绑定，当数据发生变化时，也可以同时触发界面的变化，即数据驱动视图。要想实现数据驱动视图，那么有这么几个步骤：1.收集我们需要监听的数据，并给他配置个监听器，当数据状态发生变化时触发监听器，然后判断是否需要重新渲染；2.数据变更时重新构建虚拟DOM；3.虚拟DOM渲染成为真实的DOM；在这里本文主要分析其中的第一步——数据监听机制，也就是Data变化到watcher监听到的这一过程。正文一、Object的数据响应机制Vu...

前言在浏览器输入一个网址之后，经过和后端的连接获取到相关的资源数据后，浏览器需要对获取的网页数据进行解析、渲染、绘制，最终展示出来的就是我们所看到的界面内容。在进行前端开发时，了解浏览器的渲染过程有利于我们在实际过程中进行渲染调优、性能调优的处理，因此是非常有必要的。浏览器介绍一、浏览器结构浏览器的组成结构大致如上，下面是具体的介绍：1.用户界面用户界面即浏览器的外壳，是我们平时所看到的浏览器界面，包括了搜索栏、书签、前进后退按钮等。当我们在用户界面进行操作时，它将我们的操作转入到浏览器引擎进

Web存储HTML5新增了两种存储方式：localStorage、sessionStorage，而在此之前，主要使用的是cookies存储。下面来讲述下这三者的区别和运用场景：cookies存储介绍cookies实际上是一个小型的文本数据（不超过4KB）每个浏览器都会有一个专门的文件夹存放cookies数据，cookies的内容主要有key/value值以及用于控制cookie有效期、安全性、使用范围的几个可选属性组成。我们可以在浏览器中看到cookie。一条cookie记录大致组成及作用如下

编写代码都讲究结构清晰，逻辑明确，便于他人阅读和团队开发，前后端都是如此，但是在过往发展的一段时间里，html很多时候都是各种div嵌套堆砌，css叠加等，这种代码当然难以阅读维护，所以相关组织也在后续推出了一系列语义化的元素标签，方便更好地搭建HMTL的语义结构，这就是HTML语义化的由来。

HTML5表单介绍

参考链接：HTML 30 年进化史

前言这边是承接上文深入解析Http请求背后的秘密（上）而写的，主要讲解在一次HTTP请求过程中，我们客户端已经创建好和服务器的连接通道之后，正式发送数据的过程。主要分两步：请求的发送和应答、断开连接。由于篇幅有限，我尽可能抓我们平时都会接触到的内容来做解析，一些不太需要了解的，就简单说明一下了，如果对你有用，记得一键三连哟~一、请求的发送和应答当我们创建好Http的连接时，接下来就是开始真正的发送我们的请求数据了，应用程序将数据发送到协议栈后，协议栈会暂时将数据放到发送缓冲区，等待应用程序的下一段数

所有的字符串方法都会返回新的字符串，而不是改变原串。查找字符串indexOf(src,index)从头开始遍历target字符串，查出匹配src的首次出现的索引（位置），未找到返回-1lastIndexOf(src,index)从末尾开始遍历target字符串，查找匹配src的首次出现的索引（位置），未找到返回-1search(src)和indexOf相同，只不过没有第二个开始位置参数。字符串提取slice(start, end)提取从start开始到end的字符串内容，如果end大于字

常规方法toString() 把数组转换为数组值（逗号分隔）的字符串。在需要原始值的时候，JS会自动把数组转换为字符串。join(param) 和toString相似，区别在于以param作为分隔符增删改pop() 删除最后一个元素，返回被删除的值push() 在最后增加一个元素，返回新数组的长度shift() 删除首个数组元素，并将后面的元素前移，返回被删除的元素unshift() 在数组的开头添加新元素，整个数组后移，返回新数组长度arr[index] = newValue 数组inde

前言我们用了那么久的浏览器，但是我们知道在输入一个网址到界面响应这背后的到底发生了什么吗？为什么我们输入www.baidu.com，它就知道我们找的是百度的地址呢？我们都知道我们按下回车之后触发的是http请求，但是http请求到底是什么，为什么它就能够请求到我们的数据呢？作为一名程序猿，探索和了解下我们的所处的网络世界，我觉得还是很有必要的。由于篇幅有限，不可能把所有细节都理清楚，因此尽可能抓我们平时都会接触到的内容来做解析，一些不太需要了解的，就简单说明一下了。同时针对每个人获取信息的目的不同，我将