[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Memory_management [Back]  [Original]

- JavaScript | MDN

MDN Web Docs

View in English Always switch to English

C malloc() free() JavaScript

  1. ,

2 1 3 JavaScript

JavaScript

JavaScript

js
const n = 123; // 
const s = "string"; // 

const o = {
  a: 1,
  b: null,
}; // 

// 
// 
const a = [1, null, "str2"];

function f(a) {
  return a + 2;
} //  ()

// 
someElement.addEventListener("click", () => {
  someElement.style.backgroundColor = "blue";
});

js
const d = new Date(); // Date 

const e = document.createElement("div"); // DOM 

js
const s = "string";
const s2 = s.substring(0, 3); // s2 
// JavaScript 
// 
//  [0, 3] 

const a = ["yeah yeah", "no no"];
const a2 = ["generation", "no no"];
const a3 = a.concat(a2);
// a, a2  4 

JavaScript (GC)

(reference) JavaScript

JavaScript

: JavaScript

js
let x = {
  a: {
    b: 2,
  },
};
// 2 
//  'x' 
// 

let y = x;
//  'y'  2 

x = 1;
//  'x'  'y' 
// 

let z = y.a;
//  'a' 
// 2
// 1  1  'z' 

y = "mozilla";
//  'x' 
// 
//  'a'  'z' 
// 

z = null;
//  x  'a' 
// 

2 2 1

js
function f() {
  const x = {};
  const y = {};
  x.a = y; // x references y
  y.a = x; // y references x

  return "azerty";
}

f();

root JavaScript root root root root

JavaScript ///

2

JavaScript API

JavaScript Node.js V8HTTP

bash
node --max-old-space-size=6000 index.js

Chrome

bash
node --expose-gc --inspect index.js

JavaScript API

WeakMap WeakSet

WeakMap WeakSet APIMap Set WeakMap WeakSet

WeakMap WeakSet weakly held x y x y x WeakMap WeakSet WeakMap 2

  • WeakMap WeakSet 1 === 1 {} !== {}Symbol.for("key") Symbol("key") Symbol.iterator Array.prototype
  • WeakMap WeakSet Array.from(map.keys()).length

WeakMap WeakSet

js
const wm = new WeakMap();
const key = {};
wm.set(key, { key });
//  `key` 
// 
// 

key key key value.key WeakMap WeakSet Barros 4

[] 2 3

WeakMap

:

js
class MyWeakMap {
  #marker = Symbol("MyWeakMapData");
  get(key) {
    return key[this.#marker];
  }
  set(key, value) {
    key[this.#marker] = value;
  }
  has(key) {
    return this.#marker in key;
  }
  delete(key) {
    delete key[this.#marker];
  }
}

MyWeakMapWeakMapWeakMap()

API

WeakRefs FinalizationRegistry

: WeakRef FinalizationRegistry

WeakRef

WeakRef URL WeakMap WeakMap undefined Map WeakRef

js
function cached(getter) {
  //  URL  WeakRef 
  const cache = new Map();
  return async (key) => {
    if (cache.has(key)) {
      const dereferencedValue = cache.get(key).deref();
      if (dereferencedValue !== undefined) {
        return dereferencedValue;
      }
    }
    const value = await getter(key);
    cache.set(key, new WeakRef(value));
    return value;
  };
}

const getImage = cached((url) => fetch(url).then((res) => res.blob()));

FinalizationRegistry Blob WeakRefMapFinalizationRegistry

js
function cached(getter) {
  //  URL  WeakRef 
  const cache = new Map();
  // 
  // 
  // 
  const registry = new FinalizationRegistry((key) => {
    // : WeakRef 
    // 
    // 
    if (!cache.get(key)?.deref()) {
      cache.delete(key);
    }
  });
  return async (key) => {
    if (cache.has(key)) {
      return cache.get(key).deref();
    }
    const value = await getter(key);
    cache.set(key, new WeakRef(value));
    registry.register(value, key);
    return value;
  };
}

const getImage = cached((url) => fetch(url).then((res) => res.blob()));

try...finally finally WeakRef FinalizationRegistry

WeakRef FinalizationRegistry API


Web Proxy Viewer  |  New URL  |  Original Page