learn es6

abstain23 · Jun 24, 2020 · b68f300 · b68f300
1 parent d1188f1
commit b68f300
Show file tree

Hide file tree

Showing 6 changed files with 171 additions and 1 deletion.
diff --git a/ES6/symbol.html b/ES6/symbol.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>模拟实现Symbol</title>
+</head>
+<body>
+  <div>
+    <h4> Symbol 函数前不能使用 new 命令，否则会报错。这是因为生成的 Symbol 是一个原始类型的值，不是对象。</h4>
+    <h4>Symbol 值不能与其他类型的值进行运算，会报错。 </h4>
+  </div>
+  <script>
+    var s = Symbol()
+    console.log(s) // Symbol()
+    console.log(typeof s)
+    console.log(s instanceof Symbol) //false
+    var s1 = Symbol('s1')
+    console.log(s1) // Symbol(s1)
+    let obj = {
+      toString() {
+        return 'toString'
+      }
+    }
+    const sym = Symbol(obj)
+    console.log(sym) // Symbol(toString
+    var s2 = Symbol('s1')
+    // Symbol 函数的参数只是表示对当前 Symbol 值的描述，相同参数的 Symbol 函数的返回值是不相等的。
+    console.log(s2 === s1)  // false
+    var ss = Symbol.for('sss')
+    var ss2 = Symbol.for('sss')
+    console.log(ss === ss2) //true
+  </script>
+</body>
+</html>
diff --git a/for0f.js b/for0f.js
@@ -0,0 +1,13 @@
+function forOf(obj, cb) {
+  let iterable, result
+  if (typeof obj[Symbol.iterator] !== 'function') {
+    throw new TypeError(obj + ' is not iterable')
+  }
+  if (typeof cb !== 'function') throw new TypeError('cb must bu calllable')
+  iterable = obj[Symbol.iterator]()
+  result = iterable.next()
+  while (!result.done) {
+    cb(result.value)
+    result = iterable.next()
+  }
+}
diff --git a/index.html b/index.html
@@ -8,6 +8,7 @@
 <body>
   <div>
     <button id="btn">click</button>
+    <img src="">
   </div>
   <!-- <script src="./手写一个event.js"></script> -->
   <script src='./实现一个简单的promise.js'></script>

diff --git a/set与map/map.js b/set与map/map.js
@@ -4,4 +4,27 @@ const o = { name: 'object' }
 m.set(o, 1)
 m.get(o)
 
-console.log(m.has(o))
+console.log(m.has(o))
+
+
+// WeakMap 只接受对象作为键名
+// WeakMap 的键名所引用的对象是弱引用  弱引用就是能够被垃圾回收的引用
+
+
+const privateData = new WeakMap();
+
+class Person {
+    constructor(name, age) {
+        privateData.set(this, { name: name, age: age });
+    }
+
+    getName() {
+        return privateData.get(this).name;
+    }
+
+    getAge() {
+        return privateData.get(this).age;
+    }
+}
+
+export default Person;
diff --git a/symbol.js b/symbol.js
@@ -0,0 +1,68 @@
+var generateName = (function () {
+  var endfix = 0
+  return function (desc) {
+    endfix++
+    return `@@${desc}_${endfix}`
+  }
+})()
+
+var SymbolPolyfill = function Symbol(desc) {
+  if (this instanceof SymbolPolyfill) throw new TypeError('Symbom is not a function')
+  var descString = desc === undefined ? undefined : String(desc)
+  var symbol = Object.create({
+    toString: function () {
+      return this.__Name__
+    },
+    valueOf: function () {
+      throw new Error('Cannot convert a Symbol value')
+    }
+  })
+  Object.defineProperties(symbol, {
+    '__Description__': {
+      value: descString,
+      writable: false,
+      enumerable: false,
+      configurable: false
+    },
+    '__Name__': {
+      value: generateName(descString),
+      writable: false,
+      enumerable: false,
+      configurable: false
+    }
+  })
+  return symbol
+}
+
+var forMap = {}
+Object.defineProperties(SymbolPolyfill, {
+  'for': {
+    value: function (desc) {
+      var descString = desc === undefined ? undefined : String(desc)
+      return forMap[descString] ? forMap[descString] : forMap[descString] = SymbolPolyfill(descString)
+    },
+    writable: true,
+    enumerable: false,
+    configurable: true
+  },
+  'keyFor': {
+    value: function (symbol) {
+      for (let key in forMap) {
+        if(forMap[key] === symbol) return key
+      }
+    },
+    writable: true,
+    enumerable: false,
+    configurable: true
+  }
+})
+
+var a = SymbolPolyfill('a')
+var b = SymbolPolyfill('a')
+console.log(a === b)
+console.log(a.toString())
+var obj = {}
+obj[a] = '1111'
+obj[b] = '222'
+console.log(obj)
+// console.log(a + 1)
diff --git a/实现一个简单的promise.js b/实现一个简单的promise.js
@@ -174,3 +174,33 @@
     window.Promise = Promise
   }(window)
 
+
+function red() {
+    console.log('red')
+}
+function green() {
+  console.log('green')
+}
+function yellow() {
+  console.log('yellow')
+}
+
+function light(cb, timer) {
+  return new Promise((resolve, reject) => {
+    setTimeout(() => {
+      cb()
+      resolve()
+    }, timer);
+  })
+}
+
+function change() {
+  light(red, 3000).
+    then(() => {
+      return light(green, 2000)
+    }).then(() => {
+      return light(yellow, 2000)
+    }).then(() => {
+    change()
+  })
+}