在本文中,我想解释JavaScript中的一些棘手概念,这些概念可能变得非常困惑,这取决于你在开发之旅中的位置,即,我将讨论JavaScript中的对象引用,范围,背景和实例化。
首先,一个例子来说明这一点:
1[] === []
2// false
<$>[警告] 好吧,刚刚发生的空数组不等于空数组。
对象参考
对象引用的概念可能非常复杂,在这里,例如,让我们检查一下object1和object2是否相同:
1let object1 = { value:10 };
2let object2 = object1;
3let object3 = { value: 10};
1object1 === object2
2//true
我们得到了事实,因为object1和object2都指向相同的记忆中的参考数据,如果我们检查object1和object3是否相同:
1object1 === object3
2// false
这是因为object3在内存中创建了另一个引用,而这与object1不一样,所以JavaScript将这两个对象视为不同的。
为了进一步解释,想象object1被创建为记忆中的地址,然后object2指向同一地址的object1。
Array 参考
回到最初的例子:
1[] === []
2// false
在JavaScript数组中,实际上是场景背后的对象,所以JavaScript将第一个[]视为新对象,并将引用存储在内存中,然后将第二个[]存储在内存中作为不同的引用。
目的和背景
背景总是与范围混淆。在遇到弯曲的时,总是创建一个范围。如果我们创建一个函数,例如,创建了一个新的范围:
1function sampleScope() {
2 let a = 'a';
3 console.log(a);
4}
如果我们从sampleScope函数之外引用变量a,它将不会被识别,因为变量在sampleScope函数范围内定义。
背景
一个背景与范围不同,它告诉你我们目前正在引用的当前对象. 使用 这个关键字访问了文本。
1console.log(this);
2// Window {postMessage: ƒ, blur: ƒ, focus: ƒ, close: ƒ, parent: Window, …}
它告诉我们我们目前处于窗口对象中. 这是JavaScript的特殊关键字,指向当前对象或背景:
1this.alert('hello');
2window.alert('hello);
上面的两个行基本上是一样的,因为这个关键字是指窗口对象,因为这是当前的背景。
如果我们创建一个像这样的新对象:
1const object4 = {
2 a: function() {
3 console.log(this);
4 }
5}
6
7object4.a();
8
9// {a: ƒ}
我们看到它会排除当前的背景,即object4的背景。
审判
假设我们想通过他们的名字和性别来跟踪我们在课堂上所拥有的学生,所以我们模拟了一个类(https://andsky.com/tech/tutorials/js-objects-prototypes-classes),看起来像这样:
1class Student {
2 constructor(name, gender){
3 console.log(this);
4 this.name = name;
5 this.gender = gender;
6 }
7 introduceStudent() {
8 console.log(`${this.name}, ${this.gender}`);
9 }
10}
我们有一个我们创建的类接受一个名称和一个性别,而且还可以访问一个记录学生的名字的功能。
现在,假设我们想创建一个类代表,而不必复制相同的代码并添加额外的信息,我们可以扩展学生类,同时为类代表创建一个新的类,如下:
1class Rep extends Student{
2 constructor(name, gender){
3 super(name, gender);
4 }
5 introduceClassRep() {
6 console.log(`${this.name}, ${this.gender}, and I'm a class rep`);
7 }
8}
扩展的关键字告诉JavaScript添加任何类扩展到当前类的属性. 每当我们扩展一个类时,我们也需要称它为构建方法,超级给了我们做这件事的权力。
现在让我们创建两个类的实例:
1const student1 = new Student('jane', 'female');
2const student2 = new Rep('cole', 'male');
创建这些新实例后,你会看到两个控制台输出是不同的,这只是因为它们是不同的类的实例。
结论
使用JavaScript,对象的行为可能一开始看起来相当复杂,但理解底层概念可以给你很多权力,并揭示底层的简单性。
我们已经研究了对象引用、背景、范围和实例如何在JavaScript中发挥作用,并展示了如何使用它们。