JS笔记1.1--基本数据类型和基本数据类型转换

最新推荐文章于 2024-06-05 11:03:55 发布

jiaody111

最新推荐文章于 2024-06-05 11:03:55 发布

阅读量228

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/weixin_42139212/article/details/87946979

版权

JS 专栏收录该内容

15 篇文章 0 订阅

订阅专栏

1.JS的三种输出语句

1.js三种输出语句
alert("这是我的第一行JS代码！");  # alert控制浏览器弹出警告框
document.write("你猜");   # document.write（） 向body中写入内容，在页面中显示
console.log("你猜我猜不猜"); # console.log 在控制台中输出内容（浏览器启用开发者模式）

2.JS语句的编写位置

<body>
	<!--JS代码可以在onclick属性中使用,当点击按钮时执行onclick中的语法-->
	<button onClick="alert('讨厌，你点我干嘛')">戳我</button>
	<!--JS代码可以写在超链接中的href属性中，当点击超链接时执行-->
	<a href="javascript:alert('讨厌，别点我')">你也点我一下</a>
</body>

虽然可以将JS语句写在标签的属性中，但是这样属于结构和行为耦合，不便于维护，不推荐。

1.<!--将JS代码写在script标签中-->
<script type="text/javascript">
	
	alert("我是script标签中的语法");
	
</script>


2.<!--将JS代码写在外部JS文件中，可以在不同的页面中同时引用相同的JS文件，然后通过script标签引入-->
<script type="text/javascript" src="Untitled-3.js">
	
	alert("我是内部的script代码");
	/*
	   本条语句不会执行，因为在引入外部JS文件的script语句中，智能执行外部JS文件中的代码。
	*/
	
</script>

3.JS基本语法

<script>
	
	/*
	  JS多行注释
	*/
	
	// 单行注释
	
	/*JS严格区分大小写
	 *每条语句以“分号”结尾
	 *忽略多个缩进和换行
	 */
</script>

4.字面量和变量

<script>
	
/*
	*1.字面量：不可改变,可直接使用 如alert(123)
              通过字面量创建的都是常量，不能被修改
	*2.变量：可以改变，可以保存字面量，更加方便使用
	*在开发中通过变量保存字面量，而不会直接使用字面量
*/
	//声明变量：使用var关键字来声明一个变量 
	var a;
	//变量赋值：
	a = 1;
	//声明和赋值同时进行 
	var a = 1;

</script>

5.标识符

自主命名的都属于标识符（函数名，变量名等），不能以字母开头，可以由数字、字母，_和$ 组成，不能是关键字或保留字。

一般使用驼峰命名法：首字母小写，其他字母的开头字母大写，其余字母小写。如helloWorld

6.字符串

JS中的六种数据类型：String 字符串 Number 数值 Boolean 布尔值 Null 空值 Undefined 未定义（基本数据类型）

基本数据类型：没有属性和方法

之所以能够访问基本数据类型的属性和方法, 是因为
在运行的时候系统自动将基本数据类型包装成了对象类型

Object 对象（引用数据类型）

<script>
	
//字符串 不加引号是变量名，加引号是变量值（双引号或者单引号均可）
	var str = "hello";
	console.log(str);
//可以使用\ 作为转义字符  \" 表示 "       \' 表示 '       \n 换行     \\表示\
	var str1 = "我说:\"今天\n天气真不错!\"";
	alert(str1);
</script>

7. 数值类型Number

typeof 检查变量类型语法： typeof 变量

<script>
	console.log(Number.MAX_VALUE); //JS中能保存的最大值 1.7976931348623157e+308
	//如果number超过最大值，返回infinity(正无穷)
	//NaN 表示 Not a Number 
</script>

使用JS进行整数运算，结果精确。但进行浮点数运算，可能会出错。不要在JS中进行精确的算术计算。

8. Null 和 Undefined

Null类型的值只有一个，就是null。专门表示一个为空的对象（boject类型）

Undefined 未定义 undefined 在变量声明但还没有赋值时，或者某个变量未声明时，该变量的值就是undefined。

9. 数据类型转换

主要指将其他数据类型转换成String Number Boolean

9.1 将其他数据类型转换为String

<script>
	/*
	*1. 调用被转换数据的toString（）方法，该方法不会改变原变量，而是将转换后的结果返回
	*  null和undefined没有toString()方法
	* 调用xxx的yyy方法,就是xxx.yyy()
	*/	var a = 123;
	console.log(typeof a);
	var b = a.toString(); //将转化后的字符串变量赋给一个新的变量
	console.log(typeof b);
	a = a.toString();
	console.log(typeof a); //将原变量转换成字符串
	
	
	/*
	*2. 调用String()函数，将被转换的数据作为参数传递给该函数
	*  将null转换为字符串"null", 将undefined转换为字符串"undefined"
	*/
	var a = 123;
	a = String(a); //调用String函数，将a转换为字符串
	console.log(typeof a);
	var b = null;
	b = String(b);
	console.log(typeof b); //null可以用String（）函数转换
	var c = undefined;
	c = String(c);
	console.log(typeof c); //undefind可以用String（）函数转换
	
</script>

9.2 将其他数据类型转换为Number

<script>
/* 1. 调用Number()函数
*      将字符串 --> 数值型 ： 
              纯数字类型，直接转换为数字；
              若字符串中含有非数字类型的字符，转换为NaN; 
              空字符串或“ ”（全是空格），转换为0

        将布尔型 --> 数值型：true转换为1，false转换为0  
	将null --> 数值型： 0
	将undefined --> 数值型： null
*/
	var a = "123";  //将纯数字类型的字符串转换为数值型
	console.log(typeof a);
	a = Number(a); //调用函数，要传参数；调用某个方法，方法名后加（），不需要传参数
	console.log(typeof a);
	
	var b = "abc";  //将含有非数值型的字符串转换为数值型
	b = Number(b);
	console.log(b); //输出是NaN
	console.log(typeof b); //将非数字类型的字符串转换为Number,输出的Number为NaN
	
	var c = "  ";   //将全是空格的字符串转换为数值型
	c = Number(c);
	console.log(c); //输出是0
	console.log(typeof c);

        var d = true;   //将布尔型转换为数值型，true转换为1，false转换为0
	d = Number(d);
	console.log(d); //输出是1
	console.log(typeof d);
</script>
	
<script>
/* parseInt()函数：专门针对将字符串转换为数值型，忽略字符串中第一个非数值类型的元素后的所有元素，只保留数值型的数据。
 * 对非String类型的数据，现将其转换为String再处理。如布尔型true,输出结果是NaN
 * parseFloat()函数：保留第一个小数点及其之后的数值型元素
*/	
	var a = "120px";
	a = parseInt(a);
	console.log(a); //输出是120
	
	var b = "120a230b";
	b = parseInt(b);
	console.log(b); //忽略第一个非数值型元素“a”之后的所有元素，输出结果是120

	var c = "a120b120";
	c = parseInt(c);
	console.log(c); //第一个元素就是非数值型，输出是NaN
	
	var d = "120.123px";
	d = parseInt(d);
	console.log(d); //小数点及其之后的元素被忽略，输出是120
	
	var e = "120.123px";
	e = parseFloat(e);
	console.log(e); //保留小数点后的数值型元素，输出是120.123
	
	var f = "120.1.2.3.px";
	f = parseFloat(f);
	console.log(f); //只保留第一个小数点之后的元素，输出是120.1
</script>

9.3 其他进制的数字

16进制数字，以0x开头。

8进制数字，以0开头。

2进制数字，以0b开头。

<script type="text/javascript">
	var a = "0xff";
	a = parseInt(a,16); //16表示按照16进制解析
	console.log(a); //输出结果是10进制 255
</script>

9.4 将其他数据类型转换为Boolean

	<script type="text/javascript">
	/* 1.使用Boolean()函数，将其他类型的数据转换为Boolean
	*  数值型：非0转换为true, 0和NaN 转换为false
	*  Infinity --> true
	*  null和undefined --> false
	*  字符串型：空串-->false，其他都是true
        *  对象 --> true
2. 使用 !! 将其他类型的数据转换成布尔型 
第一个'!'将值转换成布尔值并取其值的非值，第二个'!'将其布尔值还原，类似于“负负得正”的道理
	*/
        var a = "123";
	a = Boolean(a);
	console.log(typeof a);
	console.log(a);//输出为true
	
	var b = 0;
	b = Boolean(b);
	console.log(b);//输出为false
	
	var c = Infinity;
	c = Boolean(c);
	console.log(c);//输出为true

	var d = null;
	d = Boolean(d);
	console.log(d); //输出为false
	
	var e = "false";
	e = Boolean(e);
	console.log(e); //输出是true
	
	var f = "";
	f = Boolean(f);
	console.log(f); //输出是false
	
	</script>