KieSun / today-i-learned

记录今天学了什么
509 stars 34 forks source link

2019.8.19 - 8.25中你学到什么? #14

Open chenmingjia opened 5 years ago

chenmingjia commented 5 years ago

在使用 Antd 的过程中发现了 Table 组件错位问题,就这个问题出发,比较了 Element - React之间对于组件的设计,就错位问题和性能展开了自己的探索和理解。

目前这个bug仍然没有修复,如果大家在 Antd Table组件使用过程发现类似的错位问题,可以看看。

并且自己也写了一篇文章,也锻炼了一下自己写 blog 的能力。 《剖析 Antd Table 组件的错位和性能问题》 https://juejin.im/post/5d593f1ef265da03ae7873b5

ghost commented 5 years ago

「实践」在IOS中实现音乐自动播放

https://juejin.im/post/5d5bf69f6fb9a06af372baef

Yangfan2016 commented 5 years ago

20190821

实现一个简单的 router


class HashRouter {
  constructor() {
    this.router = {};
    this.historys = [];
    this.index = this.historys.length - 1;
    this.isBackOrGo = false;

    this.init();
  }
  init() {
    window.addEventListener("hashchange", () => {
      this.refresh();
    });
  }
  route(path, cb = () => {}) {
    this.router[path] = cb;
  }
  refresh() {
    let hash = window.location.hash.slice(1) || "/";
    this.change(hash);
    if (this.isBackOrGo) return;

    this.historys.push(hash);
    this.index++;
    this.isBackOrGo = false;
  }
  change(url) {
    this.router[url]();
  }
  back() {
    this.isBackOrGo = true;

    this.index--;

    if (this.index < 0) {
      this.index = 0;
      return;
    }

    let curUrl = this.historys[this.index];
    window.location.hash = curUrl;
  }
  forward() {
    this.isBackOrGo = true;
    const len = this.historys.length - 1;
    this.index++;

    if (this.index > len) {
      this.index = len;
      return;
    }

    let curUrl = this.historys[this.index];
    window.location.hash = curUrl;
  }
}

class HistoryRouter {
  constructor() {
    this.router = {};

    this.init();
  }
  init() {
    window.addEventListener("popstate", ({ state }) => {
      let { path } = state || {};
      path = path || "/";
      this.router[path] && this.router[path]();
    });
  }
  route(path, cb = () => {}) {
    this.router[path] = cb;
  }
  push(path) {
    window.history.pushState({ path }, null, path);
    this.router[path] && this.router[path]();
  }
  go(n) {
    window.history.go(n);
  }
  back() {
    window.history.back();
  }
  forward() {
    window.history.forward();
  }
}

export { HashRouter, HistoryRouter };
import { HashRouter, HistoryRouter } from "./router";

const router = new HashRouter();
// const router = new HistoryRouter();

router.route("/a", () => {
  console.log("aaa");
});

router.route("/b", () => {
  console.log("bbb");
});

router.route("/c", () => {
  console.log("ccc");
});

btnGo.addEventListener("click", () => {
  router.forward();
});

btnBack.addEventListener("click", () => {
  router.back();
});
klren0312 commented 5 years ago

2019.8.21

导入bson文件到MongoDB

mongorestore -d 数据库名称 包含bson文件的文件夹
careteenL commented 5 years ago

使用JS刷Leetcode

第一周传送门

careteenL commented 5 years ago

LRU (最近最少使用) 缓存机制

实现

/**
 * @leetcode https://leetcode-cn.com/problems/lru-cache/
 * @param {number} capacity
 */
class LRU {
  constructor(capacity) {
    this.cache = new Map()
    this.capacity = capacity
  }

  get (key) {
    let temp = this.cache.get(key)
    if (temp) {
      this.cache.delete(key)
      this.cache.set(key, temp)
      return temp
    } else {
      return -1
    }
  }

  put (key, value) {
    if (this.cache.has(key)) {
      this.cache.delete(key)
      this.cache.set(key, value)
    } else if (this.cache.size >= this.capacity) {
      this.cache.delete(this.cache.keys().next().value) // map.keys().next().value具有有序性
    }
    this.cache.set(key, value)
  }
}

测试用例

let lru = new LRU(2) // Map有序,后面的看做最新添加的
lru.put(1, 1) // Map(1) {1 => 1}
lru.put(2, 2) // Map(2) {1 => 1, 2 => 2}
lru.get(1) // return 1 Map(2) {2 => 2, 1 => 1}
lru.put(3, 3) // Map(2) {1 => 1, 3 => 3}
lru.get(2) // return -1
lru.put(4, 4) // Map(2) {3 => 3, 4 => 4}
lru.get(1) // return -1
lru.get(3) // return 3 Map(2) {4 => 4, 3 => 3}
lru.get(4) // return 4 Map(2) {3 => 3, 4 => 4}
ghost commented 5 years ago

「leetcode」136.只出现一次的数字

https://juejin.im/post/5d5e7fcae51d4561ad6548c6

Yangfan2016 commented 5 years ago

20190823

Object.create


Object.create = function(proto, propertiesObject) {
    // ...
    function F() {}
    F.prototype = proto;
    return new F();
};
ghost commented 5 years ago

「leetcode」191. 位1的个数 https://juejin.im/post/5d620f0e5188251e69336f96

「leetcode」268.缺失数字 https://juejin.im/post/5d6201105188256bf611968f

「leetcode」29.两数相除 https://juejin.im/post/5d5fddb0f265da03940212ca