JavaScript (二) -- 基础语法

普雅^0^雷蒙达

已于 2023-05-01 21:40:13 修改

阅读量1.9k

点赞数 1

分类专栏： # JavaScript 文章标签： html 前端

于 2023-04-30 22:46:33 首次发布

本文链接：https://blog.csdn.net/PUYALEI/article/details/130451759

版权

JavaScript 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

1. 输入输出语句

1.1 prompt()（对话框）：

1.2 alert() （弹出框）

1.3 console.log()（控制台输出）

1.4 document.write() （网页输出）

6. 流程控制语句（if、swich语句）

1. 输入输出语句

1.1 prompt()（对话框）：

JavaScript中的prompt()函数用于向用户显示一个对话框，提示用户输入一些信息。该函数有一个参数，表示要显示给用户的提示信息。

var name = prompt("请输入您的姓名:");

上述代码中，使用prompt()函数显示一个对话框，提示用户输入姓名，并将用户输入的值赋值给变量name。用户输入的内容以字符串的形式返回，如果用户点击了"取消"按钮，则会返回null。

1.2 alert() （弹出框）

可以使用alert()函数向用户显示一个窗口，弹出框通常用来显示提示信息。

alert("Hello world!");

1.3 console.log()（控制台输出）

控制台输出是开发者常用的一种输出方式，可以在浏览器的开发者工具中查看输出结果。

console.log("Hello world!");

1.4 document.write() （网页输出）

可以在网页中输出信息。

document.write("Hello world!");

2. 变量与常量

JavaScript 属于弱类型的语言，定义变量时不区分具体的数据类型。

定义局部变量： var 变量名 = 值;

//1.定义局部变量
var name = "张三";
var age = 23;
document.write(name + "," + age +"<br>");

定义全局变量：变量名 = 值;

//2.定义全局变量
{
    var l1 = "aa";
    l2 = "bb";
}
//document.write(l1);
document.write(l2 + "<br>");

定义常量 const：常量名 = 值;

//3.定义常量
const PI = 3.1415926;
//PI = 3.15;
document.write(PI);

3. 原始数据类型

小拓展：

在JavaScript中，undefined是一种特殊的值，用于表示变量未定义或未赋值。如果一个变量没有被显式赋值，那么它的值就是undefined。例如：
var x;
console.log(x); // 输出undefined
在上述代码中，变量x没有赋值，因此它的值是undefined。

另外，可以使用typeof操作符来检查一个变量的数据类型，例如：
var x;
console.log(typeof x); // 输出"undefined"
最后，需要注意的是，在使用变量之前，应该先对它进行判断，避免出现未定义的情况，例如：
if (typeof x !== "undefined") {
  // 变量已定义，可以使用
  console.log(x);
} else {
  // 变量未定义，无法使用
  console.log("Variable is undefined");
}

4. typeof（）方法

在JavaScript中，typeof是一个操作符，用于判断一个值的数据类型。它可以用于任何值，包括变量、函数、字符串、数值、布尔值、对象和undefined等。

<script>
		var age = 18;
		document.write( typeof(age) );//number
		
		document.write("<br/>")
		
		var name = "金刚芭比";
		document.write( typeof(name) );//string
		
		document.write("<br/>")
		
		var isMan = true;
		document.write( typeof(isMan) );//boolean
		
		document.write("<br/>")
		
		var a = null;
		document.write( typeof(a) );//object ,null的类型解析出来是object,这时js遗留的远古BUG
		
		document.write("<br/>")
		
		var b;
		document.write( typeof(b) );//undefined

		document.write("<br/>")

		var fun = function(a,b) {
		    alert(a+b);
		}
		document.write( typeof(fun));//function

		document.write("<br/>")

		var arr = [1,2,3];
		document.write( typeof(arr));//object
		
	</script>

5. 运算符

5.1 算数运算符

算术运算符的特殊使用：

在JS中,如果算数运算符运算的不是number类型,JS会自动将元素往number进行转换。
boolean: true:1 false:0。
string: 能转为数字的直接转成数字,不能转的就是NaN(不是数字的数字)。

<script>
		// 算术运算符的特殊使用
		//在JS中,如果算数运算符运算的不是number类型,JS会自动将元素往number进行转换
		//boolean: true:1  false:0
		//string: 能转为数字的直接转成数字,不能转的就是NaN(不是数字的数字)
		var s = +true;
		document.write(s+ ":" + typeof(s) );//1:number
		
		document.write("<br/>")
		
		var name = +"叫你一声，你敢答应吗？";
		document.write(name+ ":" +  typeof(name) );//NaN:string
		
		document.write("<br/>")
		
		var age = +"123";
		document.write(age+ ":" +  typeof(age) );//123:number
	</script>

小拓展：

"NaN"（Not a Number）表示不是数字（Not a Number），通常在JavaScript中表示数字类型的操作失败时会返回NaN。NaN是一个特殊的数字值，它不等于任何其他值，包括自身。因此，在JavaScript中，不能使用等于运算符（==）或全等运算符（===）来比较NaN和其他值，这两个运算符都会返回false。

例如，如果尝试将非数字字符串转换成数字，将返回NaN：
var x = parseInt("hello");
console.log(x); // NaN
在上述代码中，将字符串"hello"尝试转换成数字，由于该字符串不是数字，所以会返回NaN。

由于NaN不等于任何值，因此在某些情况下需要检查一个值是否为NaN。可以使用全局的isNaN()函数来检查一个值是否为NaN，例如：
var x = parseInt("hello");
if (isNaN(x)) {
  console.log("Not a number");
} else {
  console.log("Valid number");
}
在上述代码中，通过调用isNaN()函数来检查变量x是否为NaN，如果是则输出"Not a number"，否则输出"Valid number"。

5.2 比较运算符

        在JavaScript中，"=="和"==="都是用来比较两个值是否相等的运算符，但它们的比较方式有所不同。

        "=="运算符会先进行类型转换，然后再比较两个值是否相等。如果两个值的数据类型不同，JavaScript会自动将它们转换成相同的数据类型，然后再进行比较。

        例如，以下代码中的"123"会被自动转换成数字123，然后再与数字1进行比较：
console.log(123 == "123"); // true
"==="运算符会直接比较两个值的数据类型和值是否都相等。如果两个值的数据类型不同，或者值不相等，就会返回false，例如：
console.log(123 === "123"); // false
注：由于"=="运算符会进行类型转换，因此可能会产生一些意想不到的结果。建议在比较两个值时，优先使用"==="运算符，以避免出现错误的结果。

5.3 逻辑运算符

逻辑运算符运算的应该是boolean类型，不过不是boolean, 那就将其向boolean转化，转化规则如下：

number: 0/NaN->false，其他的全是true
string: ""（即空字符串）->false，其他的全是true
null/undefined -> false

<script>
		
		/* 
			逻辑运算符运算的应该是boolean类型
			不过不是boolean, 那就将其向boolean转化
				number: 0/NaN->false  其他的全是true
				string: ""->false  其他的全是true
				null/undefined -> false
		 */
		
		var num = 100;
		document.write(!num) //true => num=true
		
		document.write("<br/>")

		var num = 0;
		document.write(!num) //false => num=false

		document.write("<br/>")

		var num = NaN;
		document.write(!num) //false => num=false

		document.write("<br/>")
		
		var name = "aaa";
		document.write(!name) //true => name=true
		
		document.write("<br/>")

		var name = "";
		document.write(!name) //false => name=false

		document.write("<br/>")
		
		var a = null;
		document.write(!a) //false => a=false
		
		document.write("<br/>")
		
		var b = undefined;
		document.write(!b) //false => b=false
		
	</script>