Daily Learning Basics of JavaScript

Basic Concepts　

JavaScript is an interpreted language, with the browser acting as the interpreter. When JavaScript is executed, it is interpreted first and then executed within the same scope. During interpretation, the function and var keywords are compiled to define variables, and after compilation, they are executed from top to bottom and assigned values to variables.　

Case-sensitive　

Everything in ECMASCript (including variables, function names, and operators) is case-sensitive.　

1. Variable　

Variables are set in memory when used for the first time, making it convenient to refer to them later in the script. Declare variables before using them. Variable declarations can be made using the var keyword.

var count, amount, level; // Multiple declarations declared with a single var keyword.　

Variable Naming　

Variable names include global variables, local variables, class variables, function parameters, and so on. They all belong to this category.　

Variable naming is prefixed with the type+Consists of meaningful words, using camel case naming method to increase the readability of variables and functions. For example: sUserName, nCount.
Prefix specification:
Each local variable must have a type prefix, which can be divided into the following types:
s: Represents strings. For example: sName, sHtml;
n: Represents numbers. For example: nPage, nTotal;
b: Represents logic. For example: bChecked, bHasLogin;
a: Represents arrays. For example: aList, aGroup;
r: Represents regular expressions. For example: rDomain, rEmail;
f: Represents functions. For example: fGetHtml, fInit;
o: Represents other objects not mentioned above, for example: oButton, oDate;
g: Represents global variables, for example: gUserName, gLoginTime;

JScript is a case-sensitive language. When creating a valid variable name, you should follow the following rules:　

Note that the first character cannot be a number.　

It can be followed by any letter or number as well as an underscore, but cannot be a space. The variable name must not be a reserved word.

JavaScript is a weakly typed language, and JavaScript ignores extra spaces. You can add spaces to the script to improve its readability.　

var is a reserved word in JavaScript, indicating that the following is a variable declaration, the variable name is a user-defined identifier, and variables are separated by commas.　

If you declare a variable but do not assign a value to it, the variable exists and its value is the Jscript value undefined.

Type coercion　

In Jscript, you can perform operations on different types of values without worrying about the JScript interpreter throwing an exception. Instead, the JScript interpreter automatically changes one of the data types (type coercion) to another data type and then performs the operation. For example:

　Operation...Result

Addition of a number and a string...Force the number to be converted to a string.
Addition of a boolean value and a string...Force the boolean value to be converted to a string.
Addition of a number and a boolean value...Force the boolean value to be converted to a number.

To explicitly convert a string to an integer, use the parseInt method. To explicitly convert a string to a number, use the parseFloat method.　

The lifetime of JavaScript variables: When you declare a variable within a function, you can only access that variable within the function. Once you exit the function, the variable is destroyed. Such variables are called local variables. You can use local variables with the same name in different functions because only the function that declared the variables can recognize each variable within it.　

If you declare a variable outside a function, all functions on the page can access this variable. The lifetime of these variables starts after they are declared and ends when the page is closed.　

js variable mind map

　

2.js data types　

Jscript has three->Primary data types, two->Composite data types and two->Special data types.　

Primary (basic) data types
String
Number
Boolean

Composite (reference) data types
　Object
Array

Special data types
Null

`Undefined`

String data type: The string data type is used to represent text in JScript. Although both double quotes (" ") and single quotes (') can be used to represent strings in JavaScript, and there is almost no difference between them, it is considered best practice to use double quotes (" ") to represent strings.　

A string value is a sequence of zero or more Unicode characters (letters, numbers, and punctuation marks) placed together.　

What is Unicode?　

Unicode provides a unique number for each character, regardless of the platform, program, or language. The development of Unicode is to provide a unified encoding for processing all characters existing in the world.　

Number data type　

We need to understand that internally, JScript represents all numbers as floating-point values, so there is no difference between integers and floating-point values in Jscript.　

Boolean data type　

Boolean (logical) can only have two values: true or false.　

js arrays and objects　

Details can be found in this article of mine->Summary of JavaScript learning—Part of arrays and objects　

Null data type: You can clear the content of a variable by assigning it a null value.　

In Jscript, the typeof operator reports null as an Object type, not as the type null.

 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
  <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
 <title></title>
 <script type="text"/javascript"> 
   alert(typeof null);
 </script>
</head>
<body>
</body>
</html> 

null is used to represent an object that does not exist, often used to indicate that a function attempts to return an object that does not exist.　

Undefined data type:　

The following situations will return the value of undefined:
Object properties do not exist,
Declared variables but never assigned.

The difference between null and undefined

alert(typeof undefined); //output "undefined" 
alert(typeof null); //output "object" 
alert(null == undefined); //output "true" 

ECMAScript considers undefined to be derived from null, so they are defined as equal.

alert(null === undefined); //output "false" 
alert(typeof null == typeof undefined); //output "false" 

The types of null and undefined are different, so the output is "false". While === represents absolute equality, null === undefined outputs false　

In addition, I will introduce a relatively important data type - reference data type　

Reference data types　

JavaScript reference data types are objects stored in heap memory. JavaScript does not allow direct access to the positions and operations in the heap memory space, but can only operate on the reference address of the object in stack memory. Therefore, the data of reference types is actually the reference address of the object in heap memory stored in stack memory. Through this reference address, it can quickly locate the object stored in heap memory.　

Let's demonstrate this assignment process of the reference data type below

　

Naturally, giving obj2Adding the name property is actually adding the name property to the object in the heap memory, obj2and obj1What is stored in stack memory is just the reference address of the heap memory object, although a copy is made, but the object pointed to is the same. Therefore, changing obj2caused by obj1change.　

Primitive type values refer to those simple data segments stored in stack memory, that is, such values are completely stored at a single location in memory.
　Reference type values refer to those objects stored in heap memory, that is, what is actually stored in the variable is just a pointer, which points to another location in memory where the object is stored.　

In short, heap memory stores reference values, while stack memory stores fixed type values.

　

In ECMAScript, variables can have two types of values, namely primitive values and reference values.　

Simple data segments stored in the stack (stack), that is, their values are directly stored at the position of variable access. Reference values are stored in the heap (heap) of objects, that is, the value stored at the variable is a pointer (point), pointing to the memory location where the object is stored.

 <script type="text"/javascript"
var box = new Object(); //Create a reference type
var box = "lee";  //Primitive type values are strings
box.age = 23;  //Adding properties to primitive type values is very strange because only objects can add properties.
alert(box.age); //Not a reference type, cannot be output;
</script> 

3.JScript operators　

Priority: Refers to the calculation order of operators, commonly said as which part to calculate first.
Associativity: The calculation order of operators with the same priority, commonly said as which direction to calculate, from left to right or from right to left.　

Data type conversion and basic wrapper types　

String() converts to string type
Number() converts to number type
Boolean() converts to boolean type　

parseInt: Converts a string to an integer. It starts parsing from the beginning of the string, stops parsing at the first non-integer position, and returns all the integers read so far. If the string does not start with an integer, it returns NaN. For example: parseInt("150 hi") returns the value:150, parseInt("hi") returns the value: NaN.
　parseFloat: Converts a string to a floating-point number. It starts parsing from the beginning of the string, stops parsing at the first non-integer position, and returns all the integers read so far. If the string does not start with an integer, it returns NaN. For example: parseFloat("15.5 hi") returns the value:15.5, parseFloat("hi 15.5") returns the value: NaN.

　eval:Evaluates a string as a JavaScript expression and returns the execution result, or returns undefined if there is no result.
Basic wrapper types　

When a primitive type value is read, a corresponding primitive wrapper object is created in the background to be able to call some methods to operate on these data. Basic wrapper types include Boolean, Number, and String

 var box = 'trigkit',4'; //Literals
box.name = 'mike';  //Invalid properties
box.age = function () { //Invalid methods
  return 22;
};
//new operator syntax
var box = new String('trigkit',4');//new operator
box.name = 'mike';  //Valid properties
box.age = function () { //Valid methods
  return 22;
}; 

The String type includes three properties and a large number of built-in methods available
　Property Description
length : returns the character length of the string
Constructor: Returns the function that creates the String object
prototype: Extends the string definition by adding properties and methods

4.js flow control　

For js flow control statements, here are only a few that are more difficult to understand. The others are not elaborated on. I will attach a mind map below.　

1.for...in statement corresponds to executing one or more statements for each property of an object or each element of an array.
　for (variable in [object | array])
statements

Parameters:　
variable: Required. A variable, which can be any property of the object or any element of the array.
　object, array: Optional. The object or array on which to iterate.
　statement: Optional. One or more statements that must be executed for each property of the object or each element of the array. It can be a compound statement.　

Although conditional control statements (such as if statements) only require code blocks (starting with the left curly brace '{' and ending with the right curly brace '}') when executing multiple statements, it is best practice to always use code blocks.

 if(args)
  alert(args);//Easy to make mistakes
if(args){
  alert(args);//Recommended to use
}

　5.js function　

Functions are reusable code blocks that are driven by events or executed when they are called.　

Jscript supports two types of functions: one is the function of the language itself, and the other is the one created by oneself.
JavaScript functions can have no parameters (but the parentheses containing parameters cannot be omitted), and can also pass parameters to the function for use by the function.　

For more knowledge about functions, please visit my other article: JavaScript Learning Summary (Four) - function function part　

Composition of Objects
Method - Function: Process, Dynamic
Property - Variable: State, Static

Finally, here is a mind map summarized by the predecessor:

That's all for this article, I hope it helps with your learning, and I also hope everyone will support the Yelling Tutorial more.