search
HomeWeb Front-endJS TutorialJavaScript data types: Basic types and reference type values_Basic knowledge

ECMAScript variables contain values ​​of two different data types: basic type values ​​and reference type values. Primitive type values ​​are simple pieces of data, while reference type values ​​are objects that may be composed of multiple values.

When assigning a value to a variable, the parser must determine whether the value is a primitive type or a reference type. Basic types include Undefined, Null, Boolean, Number and String. These five basic data types are accessed by value, so the actual value stored in the variable can be manipulated; the value of the reference type is stored in memory. object. Unlike other languages, JavaScript does not allow direct access to locations in memory, which means that the memory space of an object cannot be directly manipulated. When operating on an object, you actually operate on a reference to the object rather than the actual object, so the value of a reference type is accessed by reference.

1. Dynamic attributes
The methods of defining basic types and defining reference types are very similar. For reference type values, we can add properties and methods to them, and we can also change and delete their properties and methods, as follows:

Copy code The code is as follows:

var person = new Object();
person.name = "zxj";
alert(person.name); //"zxj" 

2. Copy variable value

If you copy a value of a basic type from one variable to another, a new value is created on the variable object and then copied to the location allocated for the new variable.

Copy code The code is as follows:

var num1 = 5;
var num2 = num1; //5

When a reference type value is copied from one variable to another variable, a copy of the value stored in the variable object will also be copied into the memory space allocated for the new variable. The difference is that this value is actually a pointer to an object stored in the heap. After copying is complete, both variables will actually refer to the same object. Therefore, changing one of the variables will affect the other variable, as shown below:

Copy code The code is as follows:

var obj1 = new Object();
var obj2 = obj1;
obj1.name = "zxj";
alert(obj2.name); //"zxj"

3. Pass parameters

The parameters of all functions in ESMAScript are passed by value. In other words, copying the value outside the function to the parameter inside the function is the same as copying the value from one variable to another. Primitive type values ​​are passed just like primitive type variables are copied. The transfer of reference type values ​​is the same as the copying of reference type variables. Many developers may be confused at this point, because there are two ways to access variables, by value and by reference, while parameters can only be passed by value.

When passing a basic type value to a parameter, the passed value will be copied to a local variable (named parameter). As shown in the following code:

Copy code The code is as follows:

function addTen(num) {
num = 10;
Return num;
}
var count = 20;
var result = addTen(count);
alert(count); // 20, no change
alert(result); // 30

Parameters are actually local variables of the function. The parameter num and the variable count do not know each other, they just have the same value. If num is passed by reference, the value of the variable count will also become 30, reflecting the changes within the function.

When passing a reference type value to a parameter, the address of the value in memory will be copied to a local variable, so changes in this local variable will be reflected outside the function. Here we use reference types to take a look:

Copy code The code is as follows:

function setName(obj) {
Obj.name = "zxj";
}
var person = new Object();
setName(person);
alert(person.name); //"zxj"

Inside this function, obj and person refer to the same object. In other words, even if the object is passed by value, obj will access the same object by reference. Therefore, when the name attribute is added to obj inside the function, the person outside the function will also be reflected, because there is only one object pointed to by person in the heap memory, and it is a global object. Many developers mistakenly believe that objects modified in the local scope will be reflected in the global scope, which means that parameters are passed by reference. To prove that objects are passed by value, let’s look at the following modified example:

Copy code The code is as follows:

function setName(obj) {
Obj.name = "zxj";
Obj = new Object();
Obj.name = "sdf";
}
var person = new Object();
setName(person);
alert(person.name);

As can be seen from the above example, if person is passed by reference, then person will automatically be modified to point to a new object whose name attribute value is "sdf". However, when person.name is accessed next, "zxj" is still displayed. This shows that even if the value of the parameter is modified inside the function, the original reference remains unchanged. In fact, when obj is overridden inside a function, this variable refers to a local object. This local object will be destroyed immediately when the function completes execution.

Think of the parameters of ECMAScript functions as local variables.

4. Detection type

Although typeof is a powerful assistant when detecting basic data types, this operator is not very useful when detecting reference types. Usually, we don't want to know whether a value is an object, but what type of object it is. ECMAScript provides the instanceof operator for this purpose, whose syntax is as follows:

Copy code The code is as follows:

result = variable instanceof constructor

If the variable is an instance of the given reference type, the instanceof operator will return true:
Copy code The code is as follows:

alert(person instanceof Object);
Statement
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
JavaScript in Action: Real-World Examples and ProjectsJavaScript in Action: Real-World Examples and ProjectsApr 19, 2025 am 12:13 AM

JavaScript's application in the real world includes front-end and back-end development. 1) Display front-end applications by building a TODO list application, involving DOM operations and event processing. 2) Build RESTfulAPI through Node.js and Express to demonstrate back-end applications.

JavaScript and the Web: Core Functionality and Use CasesJavaScript and the Web: Core Functionality and Use CasesApr 18, 2025 am 12:19 AM

The main uses of JavaScript in web development include client interaction, form verification and asynchronous communication. 1) Dynamic content update and user interaction through DOM operations; 2) Client verification is carried out before the user submits data to improve the user experience; 3) Refreshless communication with the server is achieved through AJAX technology.

Understanding the JavaScript Engine: Implementation DetailsUnderstanding the JavaScript Engine: Implementation DetailsApr 17, 2025 am 12:05 AM

Understanding how JavaScript engine works internally is important to developers because it helps write more efficient code and understand performance bottlenecks and optimization strategies. 1) The engine's workflow includes three stages: parsing, compiling and execution; 2) During the execution process, the engine will perform dynamic optimization, such as inline cache and hidden classes; 3) Best practices include avoiding global variables, optimizing loops, using const and lets, and avoiding excessive use of closures.

Python vs. JavaScript: The Learning Curve and Ease of UsePython vs. JavaScript: The Learning Curve and Ease of UseApr 16, 2025 am 12:12 AM

Python is more suitable for beginners, with a smooth learning curve and concise syntax; JavaScript is suitable for front-end development, with a steep learning curve and flexible syntax. 1. Python syntax is intuitive and suitable for data science and back-end development. 2. JavaScript is flexible and widely used in front-end and server-side programming.

Python vs. JavaScript: Community, Libraries, and ResourcesPython vs. JavaScript: Community, Libraries, and ResourcesApr 15, 2025 am 12:16 AM

Python and JavaScript have their own advantages and disadvantages in terms of community, libraries and resources. 1) The Python community is friendly and suitable for beginners, but the front-end development resources are not as rich as JavaScript. 2) Python is powerful in data science and machine learning libraries, while JavaScript is better in front-end development libraries and frameworks. 3) Both have rich learning resources, but Python is suitable for starting with official documents, while JavaScript is better with MDNWebDocs. The choice should be based on project needs and personal interests.

From C/C   to JavaScript: How It All WorksFrom C/C to JavaScript: How It All WorksApr 14, 2025 am 12:05 AM

The shift from C/C to JavaScript requires adapting to dynamic typing, garbage collection and asynchronous programming. 1) C/C is a statically typed language that requires manual memory management, while JavaScript is dynamically typed and garbage collection is automatically processed. 2) C/C needs to be compiled into machine code, while JavaScript is an interpreted language. 3) JavaScript introduces concepts such as closures, prototype chains and Promise, which enhances flexibility and asynchronous programming capabilities.

JavaScript Engines: Comparing ImplementationsJavaScript Engines: Comparing ImplementationsApr 13, 2025 am 12:05 AM

Different JavaScript engines have different effects when parsing and executing JavaScript code, because the implementation principles and optimization strategies of each engine differ. 1. Lexical analysis: convert source code into lexical unit. 2. Grammar analysis: Generate an abstract syntax tree. 3. Optimization and compilation: Generate machine code through the JIT compiler. 4. Execute: Run the machine code. V8 engine optimizes through instant compilation and hidden class, SpiderMonkey uses a type inference system, resulting in different performance performance on the same code.

Beyond the Browser: JavaScript in the Real WorldBeyond the Browser: JavaScript in the Real WorldApr 12, 2025 am 12:06 AM

JavaScript's applications in the real world include server-side programming, mobile application development and Internet of Things control: 1. Server-side programming is realized through Node.js, suitable for high concurrent request processing. 2. Mobile application development is carried out through ReactNative and supports cross-platform deployment. 3. Used for IoT device control through Johnny-Five library, suitable for hardware interaction.

See all articles

Hot AI Tools

Undresser.AI Undress

Undresser.AI Undress

AI-powered app for creating realistic nude photos

AI Clothes Remover

AI Clothes Remover

Online AI tool for removing clothes from photos.

Undress AI Tool

Undress AI Tool

Undress images for free

Clothoff.io

Clothoff.io

AI clothes remover

AI Hentai Generator

AI Hentai Generator

Generate AI Hentai for free.

Hot Tools

MinGW - Minimalist GNU for Windows

MinGW - Minimalist GNU for Windows

This project is in the process of being migrated to osdn.net/projects/mingw, you can continue to follow us there. MinGW: A native Windows port of the GNU Compiler Collection (GCC), freely distributable import libraries and header files for building native Windows applications; includes extensions to the MSVC runtime to support C99 functionality. All MinGW software can run on 64-bit Windows platforms.

SAP NetWeaver Server Adapter for Eclipse

SAP NetWeaver Server Adapter for Eclipse

Integrate Eclipse with SAP NetWeaver application server.

Dreamweaver Mac version

Dreamweaver Mac version

Visual web development tools

EditPlus Chinese cracked version

EditPlus Chinese cracked version

Small size, syntax highlighting, does not support code prompt function

Safe Exam Browser

Safe Exam Browser

Safe Exam Browser is a secure browser environment for taking online exams securely. This software turns any computer into a secure workstation. It controls access to any utility and prevents students from using unauthorized resources.