文章笔记: 阮一峰 Redux 教程 (一) 阮一峰 Redux 教程 (二) 阮一峰 Redux 教程 (三)

文章笔记: IntersectionObserver API 使用教程

文章笔记: 前端都该懂的浏览器工作原理，你懂了吗？

Array.filter() 与 Array.find() 功能概述

• filter()

  对调用数组进行遍历，找出符合指点条件的所有元素，将查找结果存储于 新数组 并返回。如果没有符合条件的元素则返回空数组。

  语法：Array.filter(function(currentValue, index, arr), thisValue)

  注意：对于 filter 结果，要先判断数组是否为空，否则 arr[index] 会致使报错

• find()

  对调用数组进行遍历，找出 第一个 符合指点条件的元素并返回。如果没有符合条件的元素返回 undefined。

  语法：Array.find(function(currentValue, index, arr), thisValue)

注：这两个方法均不会改变原始数组，对空数组均不进行检测。

JSX 渲染方式

react 一般的渲染语法是 JSX，具体介绍参见 JSX 简介

DOM 内容会被预先统一转义，以字符串的形式被页面渲染，这样可以有效地防止 XSS (cross-site-scripting，跨站脚本) 攻击

但是，当变量内含有元素标签时，由于被统一转成了字符串，元素标签并不会被解读成 DOM 元素。因此，在某些特定情况，需要使用 dangerouslySetInnerHTML 实现渲染

dangerouslySetInnerHTML

dangerouslySetInnerHTML 是 react 提供的一种元素属性，用法如下：

1

<div dangerouslySetInnerHTML = {{ __html: param }} ><div/>

case 穿透

当程序判断某个 case 的条件为真后，将不再进行条件判断，直接执行该 case 及其后所有 case 条件的语句，直到遇到 break

涉及语言：c, Java, JavaScript

注：良好的习惯是写 default

webpack 异步加载（代码切割）的原理

webpack 一般是把所有js模块都打包到一个.js文件，然后在页面加载时请求这个文件。但是，有些js模块的功能并不需要在页面加载时生效（例如按钮点击触发的操作），因此可以把这类js模块独立导出一个.js文件（chunk）。当使用这个模块的时候，webpack 会构造 script dom 元素，由浏览器发起异步请求，去获得这个js文件（jsonp形式）。