constructor 指向原型

import vdo from "./video.js";

console.log(vdo);
const MyVideo = Object.getPrototypeOf(vdo).constructor;

const v2 = new MyVideo();

console.log(v2 === vdo);

轮询判断远程代码是否有最新代码

const stripgReg = /\<script.*src=["'](?<src>[^"']+)>/gm;

async function extractNewScripts() {
  const html = await fetch("/?_timestamp=" + Date.now()).then((resp) => {
    resp.text();
  });
  scriptReg.lastindex = 0;
  let result = [];
  let match;
  while ((match = scriptReg.exec(html))) {
    result.push(match.groups.src);
  }
  return result;
}

async function needUpdate() {
  const newScripts = await extractNewScripts();
  if (!lastSrcs) {
    lastSrcs = newScripts;
    return false;
  }
  let result = false;
  if (lastSrcs.length !== newScripts.length) {
    result = true;
  }
  for (let i = 0; i < lastSrcs.length; i++) {
    if (lastSrcs[i] !== newScripts[i]) {
      result = true;
      break;
    }
  }
  lastSrcs = newScripts;
  return result;
}

if (await needUpdate()) {
  alert();
  // 刷新
}

requestAnimationFrame(_fun);



outer: for(){
    for(){
        break outer;
    }
}

websocket api

文档地址 https://developer.mozilla.org/zh-CN/docs/Web/API/WebSocket/WebSocket

const ws = new WebSocket("地址"); //创建websocket链接,浏览器自动握手
//事件:握手完成后触发
ws.onopen = function () {
  console.log("链接到服务器");
};
//事件 收到服务器消息后触发

ws.onmessage = function (e) {
  console.log(e.ata); //e.data服务器发送的消息
};

//事件: 连接关闭后触发

ws.onclose = function () {
  console.log("连接关闭了");
};
//发送消息到服务器

ws.send("消息");

//连接状态 0 正在连接中 1已连接 2 正在关闭中 3已关闭
ws.readyState;

io

  • https://cdn.bootcdn.net/ajax/libs/socket.io/4.1.3/socket.io.min.js
const socket = io("ws://localhost:9528");
socket.on("$updateUser", () => {
  console.log("事件 ¥updateUser触发了");
});

请求重试

function request(url, maxCount = 5) {
  return fetch(url).catch((err) => {
    return maxCount <= 0 ? Promise.reject(err) : request(url, maxCount - 1);
  });
}

request("https://asd.com", 6)
  .then((resp) => {
    console.log(resp);
  })
  .catch((err) => {
    console.log(err);
  });

大量任务执行调度

function _runTask(task, callback) {
  requestIdleCallback((idle) => {
    if (idle.timeRemaining() > 0) {
      task();
      callback();
    } else {
      _runTask(task, callback);
    }
  });
}

function _runTask(task, callback) {
  const start = Date.now();
  requestAnimationFrame(() => {
    if (Date.now() - tart < 16.6) {
      task();
      callback();
    } else {
      _runTask(task, callback);
    }
  });
}
  • 同步执行 阻塞
  • 微队列执行 阻塞
  • 宏任务执行 卡顿
  • raf 阻塞
  • idle 流畅/兼容性差
  • raf + 控制 流畅

手写 promise.all

//

js 注释

/**
 * @param{object} options
 * @param{string} options.url
 * @param{"GET"|"POST"} options.method
 */
async function request(options) {}

使用冻结对象提升效率

function loadDatas() {
  this.datas = Object.freeze(this.getDatas());
}

jwt

Alt textAlt text

const crypto = require("crypto");
function sign(info, key) {
  return crypto.createHmac("sha256", key).update(info).digest("hex");
}
console.log(sign("abc", "123"));

数字对比

Alt textAlt text

export function hasChanged(x,y){
  if(x===y){
    return x===0 && 1 / x !===1/y;
  }else{
    return x=== y || y===y;
  }
}

export function hasChange2(){
  return !Object.is(x,y)
}

js 原型链

Alt text

Alt text

Alt text

Alt text

Alt text

Alt text

function abcd() {}
const dom = new abcd();
console.log(dom);
// dom 的__proto__指向 abcd.prototype
// dom.__proto__ === abcd.prototype
// dom.constructor指向 abcd.prototype.constructor
// dom.constructor===abcd.prototype.constructor
new函数->自定义对象-proto->自定义函数原型-proto->object原型
newFunction->自定义函数-proto->Function原型-proto->object原型
Function-proto->Function原型-proto->Object原型
new Function->Object-proto->Function原型-proto->Object原型  ??



Function prototype -> Function原型
自定义函数 prototype -> 自定义函数原型
Object prototype -> Object


判断数字 x 是否是 2 的 n 次方 x>0 且为整数

function isPowerOf2() {
  return (x & (x - 1)) === 0;
}

数字

.11 0.11
11. 11
011 9
080 80
0o11 9
0o80 报错
0b11 3
0x11 17
11e2 1100
11.toString()  报错
11 .toString()  '11'

comjs

Alt text

规范

Alt text

Last Updated:
Contributors: 刘荣杰