π Author: Ashan
π About the author: the little sister of the post-95 front end, the contracted author of blue bridge, and the public name author of "information technology think tank"
π Exclusive benefits for fans: knowledge system, interview question bank, technical assistance, resume template. Official account number at the end of the paper
π Mail delivery (1-2 times a week): official account of the public information technology think tank.
β
Money is tight, time is tight, clothes are tight and eyebrows are tight. This is the legendary four tight prospects~
There are six related tweets in this JS basic notes series
This is the first part: JS introduction and basic grammar
This is the note that the author learned JS from the video a long time ago~
I hope it will inspire you~
catalogue
02 JS basic code specification
01 JavaScript (JS for short)
js is divided into three parts:
-
ECMAScript Standard - the basic syntax of js
-
DOM------Document Object Model
-
BOM------Browser Object Model
What is JavaScript?
-
It is a scripting language (it needs no compilation and can be executed directly. Common scripting languages: t-sql,cmd)
-
It is an interpretative language
-
Is a dynamically typed language
-
Is an object-based language
be careful:
1. Compiling language is a binary language that needs to be translated into the computer before it can be executed
2. The front-end is based on HTML (markup language for displaying data), CSS (beautifying pages)
JavaScript (user browser interaction).
js is not JavaScript, but LiveScript
The role of js? Solve the problem of interaction between users and browsers
js code can be written in three places:
1. Write js code in the tag of script in the html file
2.js code can be written in html tags
<script> //js code alert("study hard and make progress every day")// A dialog box pops up in the page </ script> <input type="button" value = "button" onclick="alert('clicked ');" / >
3. You can write js code in the js file, but it needs to be introduced into the html page src="js path" in the tag of script
02 Operator
Operators: some symbols ----- used to calculate
-
Arithmetic operator: + - * /%
-
Arithmetic expression: an expression connected by arithmetic operators
-
Unary operator: the symbol + + - that this operator can operate on with only one operand
-
Binary operator: this operator requires two operands to operate,
-
Ternary operators: conditional expressions? Expression 1: expression 2
-
Compound operator: + = - = * = / =%=
-
Compound operation expression: an expression connected by a compound operator
var num=10; num+=10;------>namely:num=num+10; console.log(num);20
Assignment operator:=
Relational operators:
-
> < >= <=Β
-
==Lax
-
===Strict
-
!= Lax inequality
-
!== Strict inequality
Relational operation expression: an expression connected by relational operators
The result of a relational operation expression is a boolean type
Logical operators:
-
&&- logic and - and
-
||- logical or - or
-
!— Logical negation negation negation
Logical operation expression: an expression connected by logical operators
-
Expression 1 & & expression 2
If one is false, the whole result is false
-
Expression 1 | expression 2
If one is true, the whole result is true
-
! Expression 1
The result of expression 1 is true and the whole result is false
The result of expression 1 is false and the whole result is true
var num1=10; var num2=20; console.log(num1==num2&&5>6 )var num=20; console.log(num>10||5<0Β )var flag=false; console.log(!flag )var num=10; var sum=(num+10)*5; console.log(sum var result = (4 >= 6 || 'people' != 'dog' && !(12 * 2 == 144) && true) ;console.log(result);varΒ numΒ =Β 10;Β var result2 =( 5 == num / 2 && (2 + 2 * num).toString() === '22') ;console.log(result2);Β var num=20; var result=num/3;//Num variable and 3 remainder -- > 10 / 3 remainder console.log(parseInt(result) var num=20; var result=num%3;//num variable and 3 remainder -- > 10 / 3 remainder console.log (result) var num = 10; VAR sum = (Num + 10) + 1 var num = 20; num% = 5; / / num = num-5; console.log (Num ) var str="5"; var num=5;console.log(str===num )console.log(5>10);//false console.log(5>=5);//true console.log(5>3);//true console.log(5==10);//false
03 JS variable
Precautions for variable names - naming of variable names:
1. Follow the hump naming method (the first letter of the first word is lowercase, and the first letters of all subsequent words are uppercase)
2. The variable name should be meaningful
3. The variable name should be standardized
4. Keywords cannot be used (some words provided by the system cannot be used)
Declare variables and initialize - initialization of variables - declare variable assignment
A variable declaring num stores a number of 100
Β varΒ num=110;
Output the value of this variable
alert(num);//Spring frame
The browser console is in the console option of the developer tool (shortcut key: F12) in the browser
console.log(num);//Output the content in the browser's console
Declare multiple variables and assign values one by one
var num1,num2,num3;//Declare / / successively assign num1 = 10; num2 = 20; Num3 = 30;
Declare multiple variables and assign values
varΒ num1=10,num2=20,num3=30; var num=10;var $break=10;var shuZi=10;
Note: the data of the operation is operated in memory
How to store data and use variables in js (name, value - > data)
All variables declared in js use VaR --- > to store data, and the data should have corresponding data types
js string type values are in double quotation marks or single quotation marks
04 JS variable action
Variables are used to store data or manipulate data
Variable declaration (var, variable name, no value)
Variable initialization (with var, variable name and value)
Variable declaration method:
var variable name;
var number;//Declaration of variables. At this time, there is no assignment, / / declare multiple variables at one time var x. Y, Z, K, J; / / are all declarations without assignment. / / initialization of variables (variables are declared and assigned) / / = meaning of assignment: meaning of assignment. / / store a number of 10var number = 10; / / store a number of 5var number2 = 5; / / store a person's name var name = "Xiaohei"; / / store true (true)var flag = true; / / store a null --- > equivalent to empty var nll = null; / / store an object var obj = new Object();
05 Exchange of JS variables
Exchange using third-party variables
var num1=10; var num2=20; Β Β // Take the value of the num1 variable and put it in the temp variable var temp=num1; / / take the value of the num2 variable and put it in the num1 variable num1=num2; / / take the value of the temp variable and put it in the num2 variable num2=temp;console.log(num1);//20 console.log(num2);//10
The second way of exchange: generally applicable to digital exchange
var num1 = 10; var num2 = 20; // Add the value in the variable num1 and the value in the variable num2, and assign it to num1 again. This variable num1 = num1 + num2;//30 // Take out the value of num1 variable and the value of num2 variable, and the subtraction result is reassigned to num2. Num2 = num1 - num2; / / 10 / / take out the value of num1 variable and the value of num2 variable, and the subtraction result is reassigned to num1. Num1 = num1 - num2; / / 20console.log (num1, num2);
be careful; Variable names cannot be duplicated, because the later ones will overwrite the previous ones
var num1=10; var num1=20; console.log(num1);
β
Exchange of extended variables: you only need to look at the code without understanding (bit operation)
var num1 = 10; var num2 = 20; num1 = num1 ^ num2; num2 = num1 ^ num2; num1 = num1 ^ num2; console.log(num1, num2);
06 notes
Annotation method:
1. Single line notes//
2. Multiline comments / β β /
//Single line comment: usually used above a line of code
/Multi line comments: generally used on functions or a piece of code /
//The commented code is no longer executed //console.log("haha, I'm beautiful again")// console.log("second line")// Declare variables and initialize / / var num=10;
07 Data type of JS
Value type (basic type):
-
String (string)
-
Number - integer and decimal (Number)
-
Boolean
-
Empty (Null)
-
Undefined
-
Symbol
Reference data type:
-
Object
-
Array
-
Function. βββββββ
var num; console.log(num+10);//Nan ------ not an number ------ > is not a number var num; console.log(num); How to get the data type of this variable? Use typeof to get // typeof The syntax used * can get what the data type of this variable is* Typeof variable name * typeof (variable name) * var num = 10; var str = "Xiaobai"; var flag = true; var nll = null; var undef; var obj = new Object();// Is to use typeof to obtain the type of variable console.log (typeof Num)// number console.log(typeof str);// string console.log(typeof flag);// boolean console.log(String(nll));// Is null console.log(typeof nll)// Not null console.log (typeof undef)// undefined console.log(typeof obj);// object console.log(typeof( num));
08 Numeric type of JS
Β // Number type: integer and decimal var num = 12; num=20; // Integer num=98.76// Decimal (floating point in other languages --- single precision, double precision floating point) // All numbers are of type number
09 Base system
What base numbers can be represented in js?
-
var num=10;// decimal system
-
var num2=012;// octal number system
-
var num3=0x123;// Hex
var num=12;//Decimal console.log(num); var num2=012;// Octal console.log(num2); var num3=0x1a;// Hexadecimal console.log(num3); var num=0x1f; console.log(num);
be careful:
Want to represent decimal: it's a normal number
Want to represent octal: start with 0
Want to represent hexadecimal: beginning with 0x
10 NaN
Do not use NaN to verify whether it is NaN βββββββ
var num; console.log(num+10==NaN); console.log("Hello!"=="I'm fine");
How to verify whether the result is NaN? isNaN() should be used
var num;//-----The variable is declared without assignment. The result is: is undefined a number ----- > not a number? Nan --- > is not a digital console.log(isNaN(10));
If the judgment result is not a number, you can use IsNaN (variable name)
var str="Hello!"; var num; var sum=num+10;//NaN console.log(sum); console.log(isNaN(sum));// Not the number is true, but the number result is false
Note: do not use NaN to judge whether it is NaN, but use IsNaN (value or variable)
eleven Type conversion
1.parseInt();// Integer conversion
console.log(parseInt("10"));//10 console.log(parseInt("10afrswfdsf"));//10 console.log(parseInt("g10"));//NaN console.log(parseInt("1fds0"));//1 console.log(parseInt("10.98"));//10 console.log(parseInt("10.98fdsfd"));//10
2.parseFloat() / / convert to decimal
console.log(parseFloat("10"));//10 console.log(parseFloat("10afrswfdsf"));//10 console.log(parseFloat("g10"));//NaN console.log(parseFloat("1fds0"));//1 console.log(parseFloat("10.98"));//10.98 console.log(parseFloat("10.98fdsfd"));//10.98
3.Number();// Turn number
console.log(Number("10"));//10 console.log(Number("10afrswfdsf"));//NaN console.log(Number("g10"));//NaN console.log(Number("1fds0"));//NaN console.log(Number("10.98"));//10.98 console.log(Number("10.98fdsfd"));//NaN
Note: parseInt() is used for integer conversion and parseFloat() is used for decimal conversion
Want to transfer numbers: Number(); More stringent than the above two methods
Other types to string types
1 .toString()βββββββ
// var num=10; // console.log(num.toString());// String type / / / / 2 string()//// var num1=20; // console.log(String(num1));
If the variable makes sense, call. toString() to use the transformation
If the variable has no meaning, use String() conversion
var num2; console.log(num2.toString()); var num3=null; console.log(num3.toString()); Β Β Β Β //This can be var num2; console.log(String(num2)); var num3=null; console.log(String(num3));
Other types to Boolean types
console.log(Boolean(1));//true console.log(Boolean(0));//false console.log(Boolean(11));//true console.log(Boolean(-10));//true console.log(Boolean("ha ha")// true console.log(Boolean(""));//false console.log(Boolean(null));//false console.log(Boolean(undefined));//false
02 JS basic code specification
var is used to declare variables in js
js should have a semicolon at the end of each line of code; (I have the habit of semicolon when writing code)
js is case sensitive: var N=10; n
The string in js can use single quotation marks or double quotation marks. At present, we use double quotation marks for the time being
thirteen JS literal
Literal: assign a value directly to a variable
Declare variables and initialize
- var num=10; //var flag=true; //var str = "hahaha"// var y=10; var n=y;
β
Add official account "information technology think tank":
π
Hard core data: 20G, 8 categories of data, which can be obtained after paying attention (PPT template, resume template, technical data)
π
Technical assistance: the leader of the technology group points out the maze. Your problem may not be a problem. Ask for resources to shout in the group.
π
Interview question bank: it is jointly contributed by small partners of various technical groups. The hot real interview questions of large factories are constantly updated.
π
Knowledge system: including programming language, algorithm, big data ecosystem components (Mysql, Hive, Spark, Flink), data warehouse, front end, etc.
ππ Book delivery lottery - Technical Assistance - Fan welfare ππ