# js

# 标准内置对象

#

  • Infinity,无穷大

  • NaN,不是一个数字

  • undefined,未赋值

  • globalThis,任何环境下的 this

# 函数

  • parseInt,从给定的字符串中解析出的一个整数或者 NaN

  • encodeURI,url 编码,以下情况不会被编码,解码(decodeURI())

    1. 保留字符:; , / ? : @ & = + $

    2. 非转义的字符:字母 数字 - _ . ! ~ * ' ( )

    3. 数字符号:#

  • encodeURIComponent,url 编码,除了非转义字符,解码(decodeURIComponent())

    1. 字母 数字 - _ . ! ~ * ' ( )
  • isFinite(),判断是否是有限数值

# 数字、日期对象

  • BigInt:可以表示大于 2^53 - 1 的整数

# 数据类型区别

  • 值类型

    占用空间固定,保存在栈中(当一个方法执行时,每个方法都会建立自己的内存栈,在这个方法内定义的变量将会逐个放入这块栈内存里,随着方法的执行结束,这个方法的内存栈也将自然销毁了。因此,所有在方法中定义的变量都是放在栈内存中的;栈中存储的是基础变量以及一些对象的引用变量,基础变量的值是存储在栈中,而引用变量存储在栈中的是指向堆中的数组或者对象的地址,这就是为何修改引用类型总会影响到其他指向这个地址的引用变量。)

  • 引用类型

    占用空间不固定,保存在堆中(当我们在程序中创建一个对象时,这个对象将被保存到运行时数据区中,以便反复利用(因为对象的创建成本通常较大),这个运行时数据区就是堆内存。堆内存中的对象不会随方法的结束而销毁,即使方法结束后,这个对象还可能被另一个引用变量所引用(方法的参数传递时很常见),则这个对象依然不会被销毁,只有当一个对象没有任何引用变量引用它时,系统的垃圾回收机制才会在核实的时候回收它。)

# 继承

# 原型

每一个 js 对象(除 null)都有另一个对象有关联,这里另一个对象就是原型,每个对象都从原型继承属属性

# 观察者模式

# 发布-订阅模式

# 模块化

# ES6

# 数据结构

  • Set

    类数组,成员唯一,可遍历

    • add

    • delete

    • has

    • clear

    • keys

    • values

    • forEach

  • WeakSet

    只能存储对象,不可遍历,垃圾回收运行前后,部分成员可能被回收

  • Map

    键值对

    • size,成员总数

    • set,设置键名对应的键值

    • get,读取 key 对应的键值

    • has,判断是否包含某个 key

    • delete,删除某个键,如果删除失败,返回 false

    • clear

    • keys

    • values

    • entries

    • forEach

  • WeakMap

    只支持对象作为键名

# Promise

# Async/Await

# 浏览器

# 重绘、重排

# 浏览器渲染机制

# http 协议

# 三次握手,四次挥手

# 状态管理

# redux

# 框架

# react

# react dev tool

# portal

Portal 提供了一种将子节点渲染到存在于父组件以外的 DOM 节点的优秀的方案

# 生命周期

  • 16.4 以后
  1. constructor

    初始化 state

  2. getDerivedStateFromProps

    第一次渲染和更新时会调用,静态函数,无法获取 this,根据 props 更新 state,不过会导致 state 来源不单一

  3. getSnapshotBeforeUpdate

    在 dom 渲染前的快照,可以保存原来的 state,props

  4. componentDidMount

    渲染真实 dom 树后调用

  5. componentDidUpdate

    更新完成函数

  6. componentWillUnmount

    组件卸载,清除定时器

# 其他

# 技术选型

# 扩展性

  • 易于增加新功能

  • 新功能的增加带来的系统复杂度

# 维护性

  • 代码逻辑清晰、简洁,便于扩展与修改

  • 高内聚、低耦合

  • 文档健全

# 易于测试

  • 功能分层清晰

  • 副作用少,尽量使用纯函数

  • 开发工具完善度、社区活跃度、生态圈

# 易于构建

  • 使用通用技术与架构

  • 构建工具的选择

# 操作系统

# 进程与线程

  • 进程:资源分配的基本单位,程序执行时的一个实例

  • 线程:程序执行的最小单位

  • 区别

    1. 进程是资源分配的最小单位,线程是程序执行的最小单位

    2. 进程有自己的独立地址空间,每启动一个进程,系统就会为它分配地址空间,建立数据表来维护代码段、堆栈段和数据段,这种操作非常昂贵。而线程是共享进程中的数据的,使用相同的地址空间,因此 CPU 切换一个线程的花费远比进程要小很多,同时创建一个线程的开销也比进程要小很多

    3. 线程之间的通信更方便,同一进程下的线程共享全局变量、静态变量等数据,而进程之间的通信需要以通信的方式(IPC)进行。不过如何处理好同步与互斥是编写多线程程序的难点

    4. 但是多进程程序更健壮,多线程程序只要有一个线程死掉,整个进程也死掉了,而一个进程死掉并不会对另外一个进程造成影响,因为进程有自己独立的地址空间

# 数据结构与算法

# web 安全

# XSS(跨站脚本攻击)

浏览器渲染整个 HTML 文档的过程中出现了不被预期的脚本指令执行

# 存储型 XSS

前端提交的数据未经处理存储到数据库,在读取返回到页面上时引发问题,比如执行 js 代码

# 反射型 XSS

发出请求时,XSS 代码作为输入提交到服务端,服务端解析后返回这段 XSS 代码,最后浏览器解析执行

# DOM 型 XSS

# 防范

  1. 转译特殊字符

  2. cookie,设置 Secure 只允许 https 协议传输,设置 HttpOnly,防止 js 脚本获取 cookie

  3. CSP 内容安全策略

# CSRF(跨站请求伪造)

一种诱骗受害者提交恶意请求的攻击,攻击者盗用了你的身份,以你的名义发送恶意请求,请求到达后端时,服务器将无法区分恶意请求和合法请求。CSRF 能够做的事情包括:以你名义发送邮件,发消息,盗取你的账号,甚至于购买商品,虚拟货币转账等。

# 防范

  1. 同源检测,禁止外域的请求

  2. CSRF token,服务端校验 token

Last Updated: 11/1/2021, 11:55:14 AM