读《react 进阶》时做的一些内容的笔记 # 组件生命周期 类组件才有生命周期，函数组件是没有的！ # 挂载阶段 constructor。构造方法，一般用于初始化组件的 state 和绑定事件处理方法等。 componentWillMount。 render。必要方法，返回 UI。他必须是个纯函数 componentDidMount。挂载后调用，一般在这个时候向服务端请求数据。在这里调用 this.setState 会引起组件重新渲染 # 更新阶段 componentWillReceiveProps（nextProps）。只在 props 引起的组件更新过程中才会被调用。 should...

学习了 React 之后，我不自觉地会将 vue 和 react 相对比，而且也在思考使用框架的同时我学习的开发思想。 # 数据绑定 他们都是响应式的框架，但他们 “实现响应式 “的方法有所不同。 # Vue vue 在数据绑定上采用了双向绑定的策略。在 vue2 之中，采用了 Object.defineProperty（Vue3 使用了 Proxy 进行重写）来递归的将每个实例的数据转化成 getter/setter，从而达到一个数据拦截的目的，加上发布订阅模式，视图感知到依赖的变化就会自动刷新，从而达到监听数据。 再对事件的监听，来修改数据，达到两方一致的效果。 # React React...

之前偶然接触到了这么一个知识点，一开始还以为是非常晦涩的概念，不过熟悉之后其实也比较简单。 # 前言 我们都知道在调用栈这么一个东西，每个函数的调用，实际上会创建一个调用帧放入调用栈之中，等调用结束，这个帧就从栈中 “弹出” 调用帧其实是用来保存一些信息的，比如调用位置、内部变量等。 比如说如果一个函数 A 调用函数 B，那么在 A 的调用帧之上，会创建一个 B 的调用帧。 如果程序内部大量的调用函数而又不释放调用帧，就会占据大量的内存资源。 #...

在 css 中，我们可以使用多种不同的方法选择元素。实际上，我们总会碰到同一个元素被选中多次的情况，而且选择器不尽相同，这个时候到底哪一个选择器选中的规则生效呢，就需要看选择器的优先级。 本文参考了我之前大二看的一本书，《CSS 权威指南》。 # 各类选择器 css 中的选择器实际上是非常多的，这里就说一些我平常用的比较多的选择器 类选择器，不用多说，这个基本上是我最常用的选择器之一 ID 选择器 属性选择器 通用选择器：* 文档结构的选择器，例如后代选择器、直接子代的选择器、相邻兄弟选择器等等 伪类、伪元素选择器，如 hover、active 等等 # 特指度 #...

webpack 是我做前端开发时一个非常重要的工具，也是现在前端工程化一个非常重要的工具 之前使用的时候基本只是知道它大概怎么使用，但并没有深入探究。这次想深入总结一下自己对 webpack 的学习 # webpack 是什么？ 官网上是这么介绍 webpack 的：本质上，webpack 是一个用于现代 Javascript 应用程序的静态模块打包工具。当 webpack 处理应用程序时，它会在内部构建一个依赖图，这个依赖图对应映射到项目所需的每一个模块，并生成一个或多个 bundle。 现代前端开发技术不断的增长，为了提高开发效率，新的工具和技术也不断的出现，比如...

以前开发的时候在本地请求接口总是会遇到跨域问题，当时基础也不扎实，也不懂的怎么解决，现在趁机会总结一下跨域的概念和几种方法。 # 同源策略 要知道什么是跨域，首先得了解一下浏览器的同源策略 为了保证用户信息的安全，防止恶意网站窃取数据，所以有了同源策略。 # 什么情况算是同源？ 协议相同 域名相同 端口相同 https://zyczxq.com:443对于这个网站来说，它的协议是 https://，域名是：zyczxq.com，端口是 443 如果协议、域名、端口有任意一个不相同，都算是非同源。 # 非同源不能干哪些事？ Cookie、LocalStorage、IndexDB...

记录一下实习中使用 React 开发需求时候遇到的一些困难和解决方案。 # 条件渲染 开发的时候经常遇到根据某个条件进行组件的渲染 比如说：有数据的时候，没有数据的时候，正在加载的时候，如果要写，用最简单入门的方式就是这么写： const list = ({list}) => { const isEmpty = !list && !list.length; return ( isEmpty ? null : <Component1/>...

在前端飞速发展的现状，模块化是一个非常重要的概念，像在 webpack 里，每一个文件就是一个模块。 模块之所以重要，是因为一个大程序如果只写在一个文件里，会非常的复杂、而且功能分割不够明确，难以在外部复用。 有了模块，我们就可以把一个大的程序按照功能拆分成一个个小模块，可以很方便的进行复用，也可以方便的提供给别人使用。 在 JavaScript 中，最主要的模块有 CommonJS、AMD、CMD 和 ES6 模块。 # CommonJS 在规范标准时代，Nodejs 的出现对前端的模块化发展具有非常大的促进作用 CommonJS 就是在 nodejs...

在互联网不断发展的今天，随着 web 端页面的庞大化，互动性越来越强，网络安全也变得越来越重要。通过简单总结两种常见的攻击，来初步学习一下。 # XSS（跨站脚本攻击，Cross Site Scripting） XSS，跨站脚本攻击，为了不和层叠样式表（Cascading Style Sheets）混淆，于是取名为 XSS。 它是发生在目标用户的浏览器层面上的，当渲染 DOM 树的过程中执行了不在预期内执行的 JS 代码时，就发生了 XSS 攻击。 大多数 XSS 攻击的主要方式是嵌入一段远程的或者第三方域的代码，然后在目标网站上执行了这段代码 # 常见场景 这里举一个简单的例子。 假设一个对...

# Cookie # Cookie 是什么？ cookie 是一些数据，用于存储 web 端的用户数据。它用于解决 “如何记录客户端的用户信息 “ 当浏览器从服务器上请求 web 页面时，属于该页面的 cookie 会被添加到该请求中。服务端通过这种方式来获取用户的信息。 # Cookie 的特点 cookie 始终在同源的 http 请求中携带，会在浏览器和服务器间来回传递。 cookie 有路径的概念，可以把它限制在某个路径下（最好能子域可见就不要主域） 一个 cookie 的大小一般在 4K 以内，具体看浏览器。 不同浏览器对一个域名下 cookie 的数量限制不一样，像 ie6...