This article will help you understand JavaScript variables and data types

Preface:
Kind tips:

variable

1. Disclaimer
2. Assignment
3. Two small grammatical details

Variable naming conventions

Why do we need data types?

Simple data types (basic data types)

Digital

String

What is data type conversion?

1. Convert to string
2. Convert to digital type (key point)
Convert to Boolean

Summarize

Preface:

I'm not working on the front end, but the back end. My main programming language is Java. I'm learning js because I saw my roommate could make dynamic web pages, but I could only make static ones. Plus I have to learn it next semester so I came here to learn it in advance.

Kind tips:

There is nothing between java and javascript. It's just that after javascript was acquired by SUN, it was changed to javascript. The first reason is that SUN's main product is java, and the second is to use the popularity of java to advertise javascript and expand the influence of javascript.

Next, I will share today's dry goods

variable

What is a variable?

We need to use programming languages to process various data in real life, but where are the various data stored? The answer is variables. Variables are not something noble. They are just a box to hold things. It is not an exaggeration to call it a plastic bag. The essence of a variable is to create a space in memory to store data. Similar to the rooms in our hotel, one room can be regarded as a variable.

Using variables

There are two steps to using variables: 1. Declare variables, 2. Assign values. We still use the same idea to understand these two steps. One day I came to a hotel and told the boss that I wanted to get a single room. After I paid, the boss gave me a room card, which meant that I could stay in that room within a certain period of time. (I paid and the boss gave me the card, which was equivalent to a declaration). After I checked in, the empty room was occupied, which was equivalent to an assignment.

Next, let's look at the use of variables in JS

1. Disclaimer

 <!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
		var age;
		</script>
	</head>
	<body>
	</body>
</html>

var is a keyword in js, which is used to declare variables. After declaring a variable using this keyword, the computer automatically allocates memory space for the variable.
age The variable name defined by the programmer, we need to access the space allocated in memory through the variable name

2. Assignment

 var age=19; //Assign the value of age to the variable 19

= is used to assign the value on the right to the variable space on the left.
The variable value is the value saved by the programmer in the space variable

3. Two small grammatical details

Update variables : When a variable is reassigned, its original value will be overwritten and the variable value will be based on the last assigned value.

 var age=18;
age=19; //The final result is 19 because 18 is covered by 19

To declare multiple variables at the same time: just write var followed by the variable names separated by commas.

 var age,number,average;

Special cases for declaring variables

Special One

 var sex; is only declared but not assigned a value, so the program does not know what it is, so the result is undefined.
		console.log(sex);

Special 2

 console.log(sex); If you do not assign a value or declare a variable, an error will be reported if you use it directly.

Special Three

 qq=90;
console.log(qq); Don't declare it and assign the value directly, and no error will be reported! ! !
This is outrageous, but it is right in JavaScript because it is so free.

Variable naming conventions

It consists of letters (AZ, az), underscores _, and dollar signs $, such as userName
Strictly case sensitive. var app; and var App; are two variables
It cannot start with a number, such as 12age is wrong
It cannot be a keyword or a reserved word, such as var, for, while.
Variable names must be meaningful and their meanings should be clear from the name.
Follow camelCase: the first letter is capitalized, and the first letter of subsequent words should be capitalized. For example: myName
Recommended translation website: Youdao, or directly Baidu

Why do we need data types?

Programming languages are used to deal with real-life problems. In the real world, we have to deal with all kinds of data, including integers, decimals, text, etc. Correspondingly, programming languages also have integers, floating-point numbers, and characters. In a computer, different types of data occupy different amounts of storage space. In order to conveniently divide data into data of different required memory sizes and make full use of the storage space, different data types are defined. Simply put, the data type is the category model of the data, which is the classification of the data. For example, the name is "Ye Qiuhan" and the age is 18. The types of these data are different.

Data type of the variable

Variables are places where values are stored. They have a name and a type. The data type of a variable determines how the bits representing those values are stored in the computer's memory. JavaScript is a weakly typed or dynamic language, which means that there is no need to declare variables in advance.

Type, the program will automatically during execution.

 var age=10; //This is a number var name='叶秋涵'; //This is a string

During the execution of the code, the data type of the variable is determined by the JS engine based on the data type of the variable value on the right side of the =. After the execution is completed, the variable has determined the data type.

js has dynamic typing, which means that the same variable can have different types

 var x=6; //x is a number var x='哔哩哔哩'; //x is a string

Simple data types (basic data types)

Simple data types in js and their descriptions

Simple data types	illustrate	default value
Number	Numeric type, including integer values and floating-point values, such as 12, 0.2022	0
Boolean	Boolean values are types, such as true and false, which are equivalent to 1 and 0.	false
String	String type, such as "叶秋涵", note that strings are enclosed in quotation marks in JS	""
Undefined	var a; declares variable a but does not give a value, then a=undefined	undefined
Null	var a=null; declares variable a as null value	null

Digital

1. Digital system

The most common bases are binary, octal, decimal, and hexadecimal

 //1. Octal digital sequence range 0~7
var num1=07; //corresponds to decimal 7
var num2=019; //corresponds to decimal 19
var num3=08 //corresponds to decimal 8
//2. Hexadecimal number sequence range: 0~9 and A~F
var num=0xA;

Now we just need to remember that in js, add 0 in front of octal and 0x in front of hexadecimal.

2. Digital range

The maximum and minimum values of values in js

 alert(Number.MAX_SAFE_INTEGER);//9007199254740991
	alert(Number.MIN_VALUE); //5e-324

3. Three special values of digital type

 alert(Infinity); //Infinity
	alert(-Infinity); //-Infinity
	alert(NaN); //NaN

Infinity, represents infinity, greater than any value
-infinity, represents infinitesimal, smaller than any value
NaN, Not a number, represents a non-numeric value

String

The string type can be any text in quotation marks. The syntax is single quotation marks **'' and double quotation marks ""**

 var srtAge = '18';
			var strName = 'Ye Qiuhan';
			var srtFood = 'I love junk food';
			//Common errors var srtNum2 = 11; //Error, without quotes, it will be considered as js code, but js does not have these syntaxes

Because the attributes in HTML tags use double quotes, we recommend using single quotes here.

Nested string quotes

js can nest double quotes with single quotes, or nest single quotes with double quotes (double quotes outside and single quotes inside, single quotes inside and double quotes outside)

 var strMsy = 'I am "Programmer" Xiao Han';
			console.log(strMsy)
			var strMsy2 = "I am 'Programmer' Xiao Han";
			console.log(strMsy2);
			//Common mistakes var badQuotes = "What on earth?"';
			console.log(strMsy2);

The results are as follows

insert image description here

String escape characters

Similar to the special characters in HTML, there are also special characters in strings, which we call escape characters.

The escape characters all start with \. Commonly used escape characters and their descriptions are as follows

Escape Character	Explanation
\n	Newline character, n means newline
\ \	Slash \
\ '	Single quotes
\ *	Double quotes
\t	Tab indent
\b	Space, b means blank

Boolean

The Boolean type has two values, true and false, where true means true and false means false.

When adding a Boolean value to a number, the value of true is 1 and the value of false is 0.

 console.log(true+1);//2
		console.log(false+0);//0

Undefined and Null

A variable that is not assigned a value after being declared will have a default value of undefined (if adding or concatenating, pay attention to the result)

 var variable;
			console.log(variable);
			console.log('hello'+variable);
			console.log(11+variable);//+ acts as a connection console.log(true+variable);

The results are as follows

insert image description here

A variable is given a null value, and the value stored in it is empty, that is, there is nothing

 var vari=null;
			console.log('hello'+vari);
			console.log(11+vari);
			console.log(true+vari);

The results are as follows

insert image description here

What is data type conversion?

When using a form, the default value of the data obtained by the prompt is a string type. At this time, simple addition operations cannot be performed, but the data type of the variable needs to be converted. In simple terms, it is to convert one data type into another.

Three common conversion methods

Convert to character type
Convert to digital
Convert to Boolean

1. Convert to string

Way	illustrate	Case
toString()	Convert to string	var num=1; alert(num.toString());
String() forced conversion	Convert to string	var num=1; alert(String(num));
Plus sign concatenation string	The result of concatenating with a string is a string	var num=1; alert(num+"I am a string");

toString() is used in the same way as String()
There are three conversion methods. The first two are familiar. The third conversion is commonly used and is also called invisible conversion.

2. Convert to digital type (key point)

(I) Using the functions provided by js

js provides two conversion functions: parseInt() and parseFloat(). The former converts the value to an integer, and the latter converts the value to a floating point number.

Just look at the code and you will understand

 var age=12;
		console.log(age);
		//Use parseInt() to convert the value to an integer console.log(parseInt(age));
		console.log(parseInt('3.12'));//Rounding console.log(parseInt('3.89'));//Rounding console.log(parseInt('10px'));
		console.log(parseInt('rem120px')) //NaN
		//Use parseFloat() to convert the value to an integer console.log(parseFloat('3.14'));//3.14
		console.log(parseFloat('120px'));//120 will remove the px unit console.log(parseFloat('rem102px'));//NaN When the js engine reads rem, it cannot recognize it and directly judges it as empty

(II) Forced conversion of Number() conversion function

 var str = '123';
		console.log(Number(str));//123
		console.log(Number('12'));//12

(III) Invisible conversion of js (- * /) Note that there is no +, which acts as a splicing

 console.log('12'-0);//12
		console.log('122'+1);//1221
		console.log('123'*123);//15129
		console.log('123'/123);//1

Convert to Boolean

Way	illustrate	Case
Boolean() Function	Other types are converted to Boolean values	Boolean('true')

Represents empty, negative values will be converted to false, such as '', 0, NaN, null, undefined
All other values will be converted to true

 console.log('');//false
		console.log(0);//false
		console.log(NaN); //false
		console.log(null);//false
		console.log(undefined); //false
		console.log('Xiaobai');//true
		console.log(12);//true

Summarize

This article ends here. I hope it can be helpful to you. I also hope you can pay more attention to more content on 123WORDPRESS.COM!

You may also be interested in:

How to accurately determine the variable type in JS
Detailed explanation of JavaScript variable types and variable scopes
Three ways to convert variables into strings in Javascript
Teach you the operators of exponentiation, square root and variable format conversion in JS
A brief discussion on automatic conversion of JavaScript variables and statements
Do you understand JavaScript variable types and conversions between variables?

<<: How to make a website look taller and more designed

>>: Detailed explanation of the solution to the problem that the content pointed to by the iframe's src does not refresh