Geek

# 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: 5/13/2022, 6:07:40 AM

← 算法 →