学习 ES6/JavaScript - 第二部分
引言：我们来稍作复习
学习过程中一个奇妙的体验就是先学习理论知识，然后再将其付诸实践。我最初出于对前端技术的好奇心开始学习 JavaScript，但随着学习的深入，我发现这门语言越来越有趣了。
我一开始就从事实讲起，现在我认为是时候深入学习基础知识了，这样在实施过程中我们就不会被理论问题所困扰。
主题
- 关于物体的一切。
- 唯一数据类型。
1. 关于物体的一切
对象几乎在所有编程语言中都会用到，它用于存储各种数据（包括复杂实体）的键值对集合。数据以键值对结构存储，其中键必须是字符串或任何符号（特殊类型将在下文讨论），而值可以是任何类型。
如何创建对象？
创建空对象有两种方法：使用对象构造函数或字面量。
我将以注册表为例来解释，注册表包含开发人员的姓名、年龄、工作年限等信息……
let register = new Object{}; //using object constructor syntax.
// OR
let register = {}; // using object literals syntax.
1.1 添加、访问和删除
键 = 属性名称。
值 = 属性值。
在对象初始化时，键和值应该用冒号 (:) 分隔。可以使用点号 (.) 添加对象，或者使用方括号 [] 添加多字键。让我们来看每种情况的最简单示例。
let register = {
user:"vikram",
age:24,
isAdmin:true,
};
console.log(register);
// Output: { user: 'vikram', age: 24, isAdmin: true }
register.experience = 78; // adding data in object
register["university education"] = "Mumbai";
/* adding data with the multiword key
you can't access multiword key by (.), you need to access in the same way of addition.
ie. alert(register["university education"])
*/
delete register.isAdmin; // deleting key
//do check the output and spot the difference.
console.log(register);
我想我不需要解释上面的代码了。它很简单，一目了然，对吧？
1.2 房产价值速记
简写是一种优化代码、简化代码的方法。让我们通过一个例子来学习：
//before shorthand
function myUser(name,age){
return {
name:name,
age:age,
}
}
let getUser = myUser("vikram",24);
alert(getUser.name);
如您所见，如果键名与参数冲突，上述示例就会变得复杂。因此，让我们看看简写版本。
function myUser(name,age){
return {
name,
age,
}
}
let getUser = myUser("vikram",24)
alert(getUser.name)
这不是更简化了吗？事实上，你可以同时使用常规的属性值赋值方式和简写方式。
1.3 克隆和合并
克隆是指在不影响原对象的情况下创建对象的副本。是的！大多数情况下，可以使用引用复制来代替克隆。虽然克隆对象不是内置函数，但它是可以实现的。我们来看一个例子：
let register = {
"name":"vikram",
"age":24,
}
let clone_register = {}
//copying register properties to clone_register
for (let key in register){
clone_register[key] = register[key];
}
console.log(clone_register);
上面的例子已经很清楚了。还有另一种直接获取对象副本的方法，即使用 object.assign，您可以在下面的示例中找到语法。
let newObjectName = Object.assign(dest,[src1,src2,src3....srcN])
让我们通过以下示例来学习如何构建用户访问级别。
let clone_register = {};
for (let key in register){
clone_register[key] = register[key];
}
let permission1 = {canView : "true"};
let permission2 = {canRead : "true"};
Object.assign(clone_register, permission1, permission2);
console.log(clone_register);
/* output:
{ user: 'vikram',
age: 23,
experience: 78,
'university education': 'Mumbai',
canView: 'true',
canRead: 'true' }
*/
2. 唯一数据类型
Javascript 以其独特的方式脱颖而出。在前一部分中，您可能已经看到了一些有趣的数据类型，例如映射、集合以及可迭代对象，如数组、字符串、列表等等。
我还会在这一部分提到一些其他例子，例如
- WeakMap 和 WeakSet。
- 销毁作业。
2.1 WeakMap 和 WeakSet
WeakMap：
让我们通过比较 Map 和 WeakMap 来学习一下。最主要的区别在于 WeakMap 必须使用 Object 作为键，而不是普通的原始值。由于 WeakMap 的键是一个对象，所有其他引用都会自动移除，从而释放内存。
我知道这有点令人困惑，好，我们Vikram现在假设 Map 的键是 Object，sahuWeakMap 的键是 Object。当我们从 Map 中删除键时，键本身Vikram会被移除，但分配的内存不会被释放；而对于 WeakMap 中以 Object 作为键的情况sahu，对该键的内存引用会自动释放。
WeakMap 示例：
let john = { name: "Vikram" };
let weakMap = new WeakMap();
weakMap.set(Vikram, "...");
Vikram = null; // overwrite the reference
// Vikram is removed from memory!
WeakMap 与 Map 具有类似的方法，例如：
weakMap.get(key) //returns value for the key if exists
weakMap.set(key, value) //Adds new entry in WeakMaps
weakMap.delete(key)
weakMap.has(key)
WeakSet
与 WeakMap 类似。
- 它类似于 Set，但你只能向 WeakSet 添加对象，而不能添加基本数据类型。
- 当一个对象存在于集合中，且可以从其他地方到达时，该对象就存在于集合中。
- 与 Set 类似，它支持 add、has 和 delete，但不支持 size、keys() 和迭代。举个例子，我们将添加一些用户作为访问过的网站，稍后通过重新声明将其删除
null。
let visitedSet = new WeakSet();
let Vikram = { name: "Vikram" };
let Nikhil = { name: "Nikhil" };
let Anish = { name: "Anish" };
visitedSet.add(Vikram); // Vikram visited us
visitedSet.add(Nikhil); // Then Nikhil
visitedSet.add(Vikram); // Vikram again
// visitedSet has 2 users now
// check if Vikram visited?
alert(visitedSet.has(Vikram)); // true
// check if Anish visited?
alert(visitedSet.has(Anish)); // false
Vikram = null;
// visitedSet will be cleaned automatically
2.2 解构赋值
在 Javascript 中，用于存储、检索和操作数据的最常用数据类型是ObjectT 或ArraysC。
有时候，你可能只需要传递特定索引处的单个值，而不是将整个对象或数组传递给函数进行计算，对吧？这时，析构赋值就派上用场了。
这其实就是将数组赋值给一个变量。我们举个例子来说明：
let myData = ["Ed","Eed","Eddy","tom And jerry"];
let [pyscho,pyschoFriend,pyschoFriend2,EveryOneFvrt] = myData;
console.log(EveryOneFvrt); //tom And jerry
是不是很简单？是的，我知道这很容易。析构赋值并不意味着破坏，而是指解构，即将数组/对象元素赋值给变量。
总结……
希望您喜欢以上博文。我还会继续分享一些 JavaScript 的基础技巧，比如proto、getter 和 setter 等等，希望能给您带来一些启发。
谢谢！请分享哦🤗
文章来源：https://dev.to/sahuvikramp/learning-es6-javascript-part-2-4ff1