前端基础（JavaScript 一）——概念、语法、数据类型

本文链接：https://blog.youkuaiyun.com/weixin_43866830/article/details/115304700

初识JavaScript

一、JavaScript定义
二、JavaScript组成
三、JavaScript使用
四、JavaScript基本语法
- 1、JavaScript变量
- 2、变量的声明和赋值
五、JavaScript数据类型

一、JavaScript定义

JavaScript是一种基于对象和事件驱动的客户端脚本语言，最初的设计是为了HTML表单的输入的正确性，它是单线程、解释性的语言。
JavaScript最初由Netscape的Brendan Eich设计，Netscape在最初将其脚本语言命名为LiveScript，后来Netscape在与Sun合作之后将其改名为JavaScript。

二、JavaScript组成

JavaScript主要由ECMAScript、BOM、DOM组成，ECMAScript描述了该语言的语法和基本对象；DOM（Document Object Model）（文档对象模型）描述了处理网页内容的方法和接口；BOM（Browser Object Model）（浏览器对象模型）描述了与浏览器进行交互的方法和接口。

三、JavaScript使用

JavaScript语言可以通过script标签进行使用，<script>元素既可以包含脚本语句，也可以通过“src”属性指向外部脚本文件。例如：
直接在标签内：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>jsdemo</title>
		<script type="text/javascript">
			console.log("hello world");
		</script>
	</head>
	<body>
	</body>
</html>

运行结果：
在这里插入图片描述
通过src链接外部文件：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>jsdemo</title>
		<script type="text/javascript" src="../js/helloWorld.js"></script>
	</head>
	<body>
	</body>
</html>

在这里插入图片描述

四、JavaScript基本语法

JavaScript对大小写是敏感的，因此在平时开发时要注意字符的大小写区别。
JavaScript代码的注释与CSS类似，但是JavaScript注释方法分为单行注释和多行注释，“//”用来进行单行的注释，“/**/”用来进行多行的注释。
JavaScript中有字面量和标识符，字面量就是指具体的值，如数字：1、2等等，还有字符串具体的值，而标识符是JavaScript中较为重要的概念，标识符就是指变量、函数、属性的名字，或者函数的参数，这些东西在后面会提到。这里要介绍的是标识符的命名规则：
1.标识符必须要以英文字母、下划线、$开头；
2.可以包含英文字母、下划线、$和数字；
3.不可以用系统的关键字、保留字（如var、if、else等等）。

1、JavaScript变量

比较官方的定义是变量指用于存储数据的占位符。其实就是一个可变的数值，用x、y等字符来表示。
在ECMAScript中变量是松散类型的，不像java、c语言等，声明的时候需要定义类型，如int、string等等。ECMAScript的变量可以随着赋值的不同而动态改变。

2、变量的声明和赋值

JavaScript变量的声明是用var实现的，赋值是使用等于符号“=”，这里的等于符号并不是代表相等，而是代表把等号后面的值赋值给等号前的变量，具体使用如下：

var a;
a = 123;
document.write(a);

上述代码实现的就是，定义一个变量，变量名为a，并为a赋值123，在浏览器中输出a。
结果：
在这里插入图片描述
也可以同时定义多个变量：

var a, b, c = 10;
a = 123, b = 20;
document.write(a + ' ' + b + ' ' + c);

结果：
在这里插入图片描述

五、JavaScript数据类型

1.JavaScript中的数据类型

简单数据类型：
undefined、null、boolean、number、string。
复杂数据类型：
object

2.typeof操作符

功能：检测变量类型。
语法：typeof 变量或者typeof(变量)，返回的值就是undefined、number、boolean、string、object等类型。具体样例如下：

	var a, b, c, d, e;
	a = 123;
	b = '123';
	c = [
		name = '小明',
		age =  12
	]
	d = true;
	console.log(typeof a,typeof b,typeof c,typeof d, typeof e);

运行结果：
在这里插入图片描述
undefined和null：
undefined表示变量未被初始化。
null表示不存在的对象。

3.number数据类型

number表示整数和浮点数。通俗来说就是数字类型，不过在计算机中有一个特殊的值NaN，即非数，常见的使用方法是isNaN(n)，用来判断n是否是数字。NaN与任何值都不相等，包括它本身。例如：

	var a = 1;
	console.log(a - 'ab3', isNaN(a - 'ab3') , isNaN(a));

输出NaN和结果：
在这里插入图片描述

类型转换

JavaScript中的数据类型是可以进行转换的，下面列举了一些常用的Number类型转换：
Number(any)：将任意类型转换成数值；
parseInt(string)：将字符串转换成整数；
parseFloat(string)：将字符串转换成浮点数。
具体样例如下：

	console.log(typeof Number('123'),Number('123'));
	console.log(typeof Number('123a'),Number('123a'));
	console.log(typeof parseInt('123.1'),parseInt('123.1'));
	console.log(typeof parseFloat('123.1'),parseFloat('123.1'));

结果：
在这里插入图片描述

4.string数据类型

string类型用于表示由0或多个16位unicode字符组成的字符序列即字符串，字符串可以由双引号或单引号表示。例如：

	var str = '这是单引号的字符串';
	var str1 = "这是双引号的字符串";
	console.log(str,str1);

结果：
在这里插入图片描述

字符串转换

字符串也可以像number一样通过转换得到，具体方法有：
var.toString()：将var转换为字符串，返回一个var副本。
String(any)：any可能为undefined或null时，使用此方法。
具体示例：

	var a = 1;
	console.log(typeof a,typeof a.toString(),a.toString());
	console.log(typeof a,typeof String(a),String(a));

结果：
在这里插入图片描述

5.boolean数据类型

boolean是用于表示真假的类型，即true表示真，false表示假。
boolaen同样可以通过方法Bollean(any)转换，这里需要注意的是，除0之外的所有数字，转换为布尔型都为true；除“”之外的所有字符串，转换为布尔型都为true；null和undefined转换为布尔型为false。具体样例如下：

	var a = 0;
	var b = 1;
	var c = '';
	var d = 'abc';
	var e = null;
	var f = undefined;
	console.log(typeof Boolean(a), Boolean(a));
	console.log(typeof Boolean(b), Boolean(b));
	console.log(typeof Boolean(c), Boolean(c));
	console.log(typeof Boolean(d), Boolean(d));
	console.log(typeof Boolean(e), Boolean(e));
	console.log(typeof Boolean(f), Boolean(f));