Javascript Basic Tutorial Operators

Operator

First we need to know what an expression is

For example i++; a+b These are all expressions

Unary operator: can only operate one value operator, called the unary operator

increment ++ and decrement- -

Look at the following code:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>运算符</title>
</head>
<script type="text/javascript">
	var box=100;
	box++;
	//box--;
	//++box;
	//--box;
	document.write(box);
</script>
<body>

</body>
</html>

The front is incremented, output 101 The rear is incremented and output 101

The front is decremented, the output is 99 The rear decrement is output 99

Note: The difference between preposition and postposition

var box=100;

//age = ++box; //First add the box to 101, and then assign it to age

//= box ++; //First assign box to age, age=100, and then accumulate

//age = --box //First reduce box to 99, Then assign the value to age

//= box -- //First assign the box value to age age=100, and then subtract

+ -Operator

var box=100;

+box; //Positive number

-box //Negative number

The plus sign (+) has an automatic transformation function

As shown in the following code

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>一元运算符</title>
</head>
<script type="text/javascript">
	var box="89";
	alert(typeof +box);  //如果没有加号，是string类型，有加号则是number类型
</script>
<body>

</body>
</html>

Arithmetic operator

Add(+)

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>算术运算符</title>
</head>
<script type="text/javascript">
	var a = 10;
	var b = 15;
	var c = a+b;
	document.write(c);
</script>
<body>

</body>
</html>

Minus(-)

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>算术运算符</title>
</head>
<script type="text/javascript">
	var a = 10;
	var b = 15;
	var c = a-b;
	document.write(c);
</script>
<body>

</body>
</html>

Multiply(*)

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>算术运算符</title>
</head>
<script type="text/javascript">
	var a = 10;
	var b = 15;
	var c = a*b;
	document.write(c);
</script>
<body>

</body>
</html>

Division(/)

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>算术运算符</title>
</head>
<script type="text/javascript">
	var a = 15;
	var b = 15;
	var c = a/b;
	document.write(c);
</script>
<body>

</body>
</html>

remainder (%)

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>算术运算符</title>
</head>
<script type="text/javascript">
	var a = 15;
	var b = 5;
	var c = a%b;
	document.write(c);
</script>
<body>

</body>
</html>

Assignment operator

图片3.png

Assignment operator Nested use of operators: the following case

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>赋值运算符</title>
</head>
<script type="text/javascript">
	y = ( x = 2) + 5;
	alert(x);
	alert(y);
</script>
<body>

</body>
</html>

Comparison operator

Ternary operator

Syntax: Expression 1 ? Expression 2: Expression 3

Example:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>三元运算符</title>
</head>
<script type="text/javascript">
	var x = 5;
		y = (x=5)?x:1;
		document.write(y);
</script>
<body>
	
</body>
</html>

Note: If expression 1 is true, the output result is expression 2, otherwise it is expression 3; For example, in the above case x=5;, judge whether expression 1 is true. If true, output the value of

&&(The conditions must be met at the same time to be true)

x=2;y=6;

x&&y>6 ;

At this time, x and y only have One item satisfies greater than 6, so the result is false;

||(As long as one of the conditions is met, it is true)

x=2;y=6;

x||y>6 ;

At this time, one of x and y satisfies the condition, so the result is true;

!(take The logic is worth the opposite, if it is true, take false, if false, take true)

x=5;y=8;

!(x>y);

First, judge whether x is greater than y. If it is not greater, it is false. If it is not false, it is true, so the result is true

##String linker +

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>字符串连接符</title>
	<script type="text/javascript">
		var a = "中国，";
		var b = "你好";
		var c = a + b;
		document.write(c);
	</script>
</head>
<body>

</body>
</html>

Continuing Learning

||

new file

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>javascript</title> </head> <body> <script type="text/javascript"> document.write("php中文网"); </script> </body> </html>

submit Reset Code
Automatic operation

Javascript Basic Tutorial Operators

ElementaryImperial CMS enterprise imitation website tutorial

ElementaryNewbies with zero foundation in WordPress build personal blogs and corporate websites

ElementaryUltimate CMS zero-based website building instruction video

ElementaryFront-end project-Shangyou [HTML/CSS/JS technology comprehensive practice]

IntermediateVue3.0 from 0 to build a universal backend management system project practice

ElementaryZero-based front-end course [Vue advanced learning and practical application]

ElementaryWEB front-end tutorial [HTML5+CSS3+JS]

ElementaryQuick introduction to apipost

IntermediateVue3+TypeScript practical tutorial-enterprise-level project practice

ElementaryLet's briefly talk about starting a business in PHP

IntermediateVUE e-commerce project (front-end & back-end dual project actual combat)

ElementaryApipost practical application [api, interface, automated testing, mock]