跳至主要內容
this

1.this的指向

1.在函数执行的时候会在函数内部创建两个变量,arguments、this
a. arguments 储存着实参的一个类数组对象。
b. this 指向函数执行的上下文 (通俗点:谁调用这个函数this就指向谁)

function test() {
    console.log(this)
}

const objA = {
    a: test,
    b: {
        c: test
    }
}

test() // window
objA.a() // objA
objA.b.c() // objA.b


Mr.Ding小于 1 分钟javascriptthis
js 原生小效果

录屏

调用摄像头

选中朗读


Mr.Ding小于 1 分钟javascript
设计模式

单例模式

相关信息

单例模式:保证一个类且只有一个实例,并提供一个访问它的全局访问点
思路:利用js的作用域,形成闭包,从而可以创建私有变量(instance),然后将创建的实例赋予这个私有变量(instance)。每当想创建这个类的实例时,先判断私有变量(instance)是否已经引用了存在的实例 如果没有引用,即这个类没有实例,就创建一个实例,然后将其赋值给私有变量(instance);如果已经引用。即已存在了该类的实例,就无需在创建,直接使用私有变量(instance)


Mr.Ding大约 4 分钟javascript闭包设计模式
面向对象

提示

  • 面向对象注重于抽象事物,而面向过程注重于叙述事物。
  • 面向对象逻辑清晰有条理,而面向过程比较方面。
  • JS 通过函数和原型,模拟了传统面向对象编程中类的概念实现了面向对象的编程模式。
  • 面向对象的变成思想,主要为了实现3件事, 封装、继承、多态。

1.封装

// 一个例子
function CreateObject(name) {
  // CreateObject 为构造函数
  this.name = name;
  this.eat = function () {
    console.log(this.name + " eat something");
  };
}
let objA = new CreateObject("A"); // 为构造函数的实例
let objB = new CreateObject("B"); // 为构造函数的实例

Mr.Ding大约 3 分钟javascriptObject面向对象
JavaScript 杂项

js 运算符

  • ?? 逻辑运算符,当左侧的操作数为 nullundefined 时,返回其右侧操作数,否则返回左侧操作数
const bar = null ?? 1 // 1 
const bar = undefined ?? 1 // 1 
const bar = 0 ?? 1 // 0 

Mr.Ding大约 7 分钟javascript垃圾回收变量提升
事件循环

进程

一个进程占据一个独立的内存空间

线程

一个进程中会有多个线程

浏览器的三大进程

  1. 浏览器进程
  2. 网络进程
  3. 渲染进程(一个标签一个渲染进程) 前端html css js 都是在这个进程里面执行

渲染进程

  • 解析HTML
  • 解析CSS
  • 计算样式
  • 布局
  • 处理同层
  • 每秒把页面画60次
  • 执行全局js代码
  • 执行事件处理函数
  • 执行计时器的回调函数
  • 等等......

Mr.Ding大约 4 分钟javascript事件循环