JavaScript基本类型和引用类型

目录

介绍

背景

JavaScript数据类型

基本类型

基本类型的行为如何？

使用typeof运算符

语法类型

为什么null返回对象？

参考类型

创建对象

对象的行为如何？

销毁对象

基本类型和引用类型之间的区别

总结

---

介绍

在我看来，理解某种编程语言的类型至关重要，因为它是构建模块。这就是为什么在本文中，我们将看到JavaScript的内置类型以及基本类型和引用类型之间的区别。

而且，来自诸如C＃之类的静态类型语言并跳转到JavaScript，由于其动态行为，我感到困惑。有趣的是，我在找类时发现它没有正式的支持。(您可能知道，Java/ c#等语言中的类在JavaScript中并不存在)起初很奇怪，但我已经习惯了。因此，我决定写这篇文章来帮助学生或开发人员分享我的知识和学习JavaScript类型的过程。

背景

当我开始使用JavaScript时，许多出色的开发人员都认为JavaScript没有类型。特别是那些来自强类型语言（例如C＃，Java和C ++）的开发人员。那时，老实说，我不知道该说些什么，因为我还不那么了解。然而今天，如果您曾经遇到过或将要遇到这类开发人员，则可以将其指向JavaScript语言规范。我将在下面提供链接，并提供一些屏幕截图，其中指出JavaScript语言确实具有类型。

在撰写本文时，我们拥有“ECMAScript 2020语言规范”，可在此处找到。最后，让我们看看规范对类型必须说些什么。请查看以下屏幕截图：

希望这能节省您的时间。现在，足够了，让我们跳入JavaScript内置类型。

JavaScript数据类型

JavaScript语言有两种类型：基本类型和引用类型。基本类型（也称为值类型）存储为简单数据类型，而引用类型存储为对象，这意味着它持有对内存位置的引用。

当使用JavaScript并处理其不同类型，基本类型和引用时，它们看起来似乎相同，但事实并非如此。此外，为了使语言一致，您可以将基本类型视为引用类型。

这是JavaScript内置类型的列表：

• boolean
• number
• bigint
• string
• null
• undefined
• symbol
• object

基本类型

种类	描述	备注
Boolean	true或false| 1或0
Number	任何整数或浮点数值。任何双精度IEEE 754数字。
BigInt	大整数，甚至超出的安全整数的Number限制。	BigInt通过将A附加n到整数的末尾来创建A。 您可以在这里检查浏览器是否支持。
String	UTF-16字符串。由单引号或双引号分隔的字符序列。
Null	仅具有一个null值的特殊基本类型。	我之所以称其为特殊，是因为它会在后面的部分中进行讨论（为什么null 返回对象？）。
Undefined	仅具有一次值（未定义）的基本类型。	undefined关键字是分配给该未初始化的变量的值。
Symbol	独特而不变的值。	有关Symbol的更多信息，您可以在此处阅读更多内容。

让我们在下面看到一些基本类型的示例：

//boolean
var iLoveJavaScript = true; 

//number
var yearsOfCoding = 10; 

//bigint
var bigIntSample = 1234567890987654321n;

//string
var programmerName = "Jin Vincent Necesario";

//null
var doesntPointToAny = null; 

//undefined
var badCompany; //undefined

基本类型的行为如何？

始终分配基本类型，然后复制值。

要实际查看行为，让我们看下面的示例：

var name1 = "Jin";
var name2 = name1;

console.log(name1); //Jin
console.log(name2); //Jin

name2 = "Vincent";

console.log(name1); //Jin
console.log(name2); //Vincent

如果您想了解发生了什么，请参见下面的图1：

图1

如您所见，变量name1和name2彼此完全分开，您可以更改name2中的值而不会影响name1，反之亦然。

使用typeof运算符

语法类型

//typeof operand
//or 
//typeof(operand)

typeof操作符是标识以string格式返回类型的基本类型的最佳方法。操作数是表示基本类型或引用类型的表达式。

让我们看下面的一些例子：

//typeof operator without using the open and close parentheses
console.log(typeof true);                     //boolean

console.log(typeof 10);                       //number

console.log(typeof bigIntSample);             //bigint

console.log(typeof "Jin Vincent Necesario");  //string

console.log(typeof null);                     //object -> oops! more about this later

console.log(typeof undefined);                //undefined
//end typeof operator without using the open and close parentheses

//typeof operator using the open and close parentheses
console.log(typeof(true));                    //boolean

console.log(typeof(10));                      //number

console.log(typeof(bigIntSample));            //bigint

console.log(typeof("Jin Vincent Necesario")); //string

console.log(typeof(null));                    //object -> oops! more about this later

console.log(typeof(undefined));               //undefined
//end typeof operator using the open and close parentheses

为什么null返回对象？

好的，您可能已经运行了上面的代码示例，并且想知道为什么null数据类型返回object。这是语言的棘手部分，即使是我，我一开始也很困惑，但是在这里没有任何疑问可以回答。

确实，这是一个错误，并且得到维护JavaScript语言的委员会TC39的承认。这个错误没有修复的一个原因是，提议的修复破坏了许多现有的网站。因此，错误仍然存​​在。有关更多信息，请参见此处。

现在，我们已经知道了为什么会这样。确定价值是否为null的最好方法是什么？为此，您可以将null直接与其值进行比较。请参阅以下示例：

var myObject1 = null;
console.log(myObject1 === null); //true

参考类型

如果您来自其他语言，例如C＃，Java或C ++，则引用类型是最接近类的内容。参考值是参考类型的实例。此外，引用类型不会将对象直接存储到为其分配了变量的变量中。因此，它拥有对内存中对象所在位置的引用。

创建对象

有多种方法可以用JavaScript创建对象。它们是：使用new运算符、对象文字和构造函数。

让我们看下面的例子：

var myObject2 = new Object(); //using the new operator
console.log(typeof(myObject2));//object

var myObject3 = {};//using the object literal ({})
console.log(typeof (myObject3));//object

//using the constructor function
function MyUnknownObject(property1, property2) {
    
    this.property1 = property1;
    this.property2 = property2;
}

var myObject4 = new MyUnknownObject("JavaSript", 23);
console.log(typeof (myObject4));//object

对象的行为如何？

让我们看下面的例子：

var _object1 = new Object();
_object1.favoriteLanguage = "JavaScript";

var _object2 = _object1; 

console.log(_object1);    //output:{favoriteLanguage: "JavaScript"}
console.log(_object2);    //output:{favoriteLanguage: "JavaScript"}

_object1.favoriteLanguage = "C#";

console.log(_object1);    //output: {favoriteLanguage: "C#"}
console.log(_object2);    //output: {favoriteLanguage: "C#"}

输出

如您所见，我们已经使用变量_object1声明了一个新object变量，并将其分配给_object2。结果，它们两个都引用相同的对象。这就是为什么对其中任何一个进行任何更改都具有相同效果的原因。

如果您想了解发生了什么，请参见下面的图2：

图2

销毁对象

垃圾回收——不再使用对象时将其释放（垃圾回收）。JavaScript就是拥有这种内置特性的语言之一。因此，使用引用类型时，您实际上不必担心手动分配内存。

此外，您可能会产生错误的印象，即不需要尊重对象。因此，最好参照不再需要的对象。为了使垃圾收集器释放该内存空间。为了做到这一点，请将object变量设置为null。

基本类型和引用类型之间的区别

两者之间的主要区别在于基本类型直接包含其值。意思是，当您为变量分配基本值时，该值将被复制到该变量中。虽然引用类型不会将对象直接存储到分配给它的变量中。相反，它保留对内存中对象所在位置的引用。

总结

在本文中，我们解决了JavaScript基本和引用类型。我们首先列出了内置类型，并显示了基本类型和引用类型。此外，我们已经了解了如何使用typeof运算符以及如何创建和销毁object。最后，我们区分了基本类型和引用类型。