Descripción general de JavaScript y sintaxis básica (¡super detallada!)

Directorio de artículos

- Descripción general de JavaScript y sintaxis básica

Descripción general de JavaScript y sintaxis básica

Descripción general de JavaScript

Primero, entendemos literalmente JavaScript, es decir, Java y Script.

java: debe compilarse como un todo y luego ejecutarse

script: el lenguaje de script no necesita ser compilado e interpretado por un motor determinado para ejecutar sql, python, html, css

Historial de JavaScript

1.JavaScript es un lenguaje de programación desarrollado por Netscape Corporation (Netscape Corporation de los Estados Unidos), con una estructura simple y un uso conveniente;

2.La empresa Netspace nombró a este lenguaje de scripting LiveScript. Su sintaxis está basada en Java, pero es mucho más simple que Java. Debido a que es un lenguaje de scripting, no necesita ser compilado y puede ser interpretado y ejecutado directamente por el navegador;

3. LiveScript creado por la compañía Netscape tiene grandes perspectivas de desarrollo, y la compañía SUN también siente que puede popularizar JAVA, por lo que las dos compañías firmaron un acuerdo para cambiar el nombre de LiveScript a JavaScript, lo que creó esta poderosa herramienta de desarrollo de páginas WEB;

El papel de JavaScript

JavaScript es un lenguaje de programación literal que se utiliza para agregar una variedad de funciones dinámicas a las páginas web (que pueden manipular el contenido web). No necesita ser compilado y puede ser interpretado y ejecutado directamente por el navegador. El navegador analiza línea por Por lo general, los scripts de JavaScript se dan cuenta de sus propias funciones incrustándolos en HTML.

1. Responder a eventos de teclado y mouse del cliente;

2. Validación de los datos del formulario de la página del cliente;

3. Utilice JavaScript para cambiar dinámicamente el estilo de las etiquetas de página.

La relación entre JavaScript, HTML y CSS

JavaScript es un lenguaje interpretativo impulsado por objetos y eventos y con seguridad, cuyo propósito es mejorar la interacción entre las páginas web y los usuarios y compensar las deficiencias del HTML.

HTML：超文本标注语言，主要用来控制内容的结构的。

CSS：级联样式表，主要用来控制HTML标签的格式的。

JavaScript：客户端的脚本程序，主要用来控制HTML标签的行为的。

Gramática básica

El script JavaScript está escrito en un conjunto de etiquetas <script>. Esta etiqueta se puede colocar en el encabezado o en el cuerpo. Generalmente se usa en el encabezado. También puede escribir el script en un archivo js externo e importar el .js externo en el archivo de página html

método uno

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>初识JS</title>
		<!-- 在script标签中写js脚本 -->
		<script type="text/javascript">
			//js脚本
		</script>
	</head>
	<body>
	</body>
</html>

Camino dos

<!-- 
导入外部js 
<scrit src="外部js文件的地址" type = "text/javascript" charset="编码格式">
</script>
-->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>初识js</title>
		//导入外部.js文件
		<script src="js/out.js" type="text/javascript" charset="UTF-8"></script>
	</head>
	<body>
	</body>
</html>

prueba

Nosotros podemos usar

conaole.log(num);

Imprime num en la consola, que es la consola que puedes ver después de presionar F12 en la página del navegador.

Tres diálogos

alert("提示对话框");		//提示对话框
confirm("选择对话框");	//选择对话框
prompt("输入对话框");	//输入对话框

variable

1. Declare variables usando la palabra clave var

var num;

2. Al declarar variables, también puede asignarles valores. JavaScript es un lenguaje débil. Los requisitos de tipo de datos para las variables no son tan estrictos como Java. No es necesario definir tipos de datos. Puede asignarle cualquier tipo .

var num1 = 1;
var num2 = "abc";
var num3 = true;
var num4 = new Date();

tipo de datos

1. Numérico (número): incluye números enteros y de coma flotante;

var number1 = 10;
var number2 = 11.12;

2. Booleano (booleano): valor lógico, verdadero o falso;

var boolean1 = true;
var boolean2 = false;

3. Tipo de cadena (String): se compone de uno o varios caracteres de texto. Puede utilizar comillas simples o dobles para ilustrar;

var str1 = "abc";
var str2 = 'abc';
var str3  ='abcd"asc"saq';//使用单引号来输入包含引号的字符串

4.undefined: indefinido, declarado pero no asignado;

 var un;
 console.log(un);//控制台输出即underfined

5.Tipo de objeto

Operador aritmético

Operador	descripción
+	Suma, concatenación de cadenas, si es un número + una cadena, el resultado se concatenará en una cadena
-	Resta, el valor se puede restar del número de la cadena y el número de la cadena se convierte implícitamente
*	multiplicación
/	división
%	Toma el resto
++	Autoadhesivo, es decir, +1
-	Decremento, es decir, -1

Ejemplo de código

<script type="text/javascript">
			//算数运算符
			var x = 10;
			var y = 5;
			var z = "5";
			var a = "a";
			console.log(x+y);
			console.log(x+z);//105 连接字符串
			console.log(x-z);//5 数值可以减去字符串的数字 对字符串的数字进行了隐式的转换
			console.log(x-a);//NaN    not a number 数字减去非数字的字符串
			
		   console.log(x*y);//50
		   console.log(x/y);//2
		   console.log(x%y);//0
		   console.log(x=++y);//6
		   console.log(x=--y);//5	   
</script>

Operador de asignación

//给定x y的值
var x = 10;
var y = 5;

Operador	ejemplo	Equivalente a	resultado
=	x=y		x = 5
+ =	x+=y	x=x+y	x = 15
- =	x-=y	x=x-y	x = 5
* =	x*=y	x=x*y	x = 50
/ =	x/=y	x=x/y	x = 2
% =	x%=y	x=x%y	x = 0

Operador de comparación

Operador	descripción
==	igual
===	Todos iguales (valor y tipo)
! =	No puede ser
>	mas que el
<	Menos que
> =	mayor o igual a
<=	Menos que o igual a

<script type="text/javascript">
	/*
	= : 赋值
	== : 等于 只比较值是否相等
	=== : 全等 比较值和类型是否相等
	*/
	var a = 5;
	var b = "5";
	console.log(a==b);//true 比较值是否相等
	console.log(a===b);//false 比较值和类型是否一致
</script>

Operadores logicos

&&:and 与
||:or 或
!:not 非

Operador condicional

JavaScript también contiene operadores condicionales que asignan valores a variables en función de determinadas condiciones.

gramática

var result = (条件表达式)?结果1:结果2
//条件成立返回结果1,条件不成立返回结果2

Ejemplo de código:

<script type="text/javascript">		   
	var a = 5;
	var result = (a === "5" || a == 5)?true:false;
	alert(result);//true
</script>

Declaración de control

Declaración de sentencia si / si no

if(){
}else{
}

Declaración de sentencia if / else if / else

if(){
}else if(){
}else{
}

Cambio de sentencia de sentencia

switch(){
	case1:break;
	case2:break;
	[default:...]
}

Declaración de bucle para

//基本格式
for(初始化;条件;增量){
	语句集;
}
//功能: 实现条件循环,当条件成立时,执行语句集,否则跳出循环体

Declaración de bucle mientras

//基本格式
while(条件){
	语句;
}
//功能:该语句与for语句一样,当条件为真时,重复循环,否则退出循环

Declaración de bucle do / while

//基本格式
do{
	...
}while(条件);
//功能:do...while循环与while循环相似,在循环的末尾检查条件,它总是至少运行一次

/*
break和continue语句
使用break语句使得循环从for或while中跳出
continue使得跳过循环内剩余的语句而进入下一次循环
*/