JavaScript基础入门学习（一）-CSDN博客

本文链接：https://blog.csdn.net/z1026909465/article/details/118937839

本文详细讲解了JavaScript的核心组成（ECMAScript、DOM与BOM）、引入方式、注释、输入输出、变量管理、数据类型及其转换，以及运算符和编程技巧。适合初学者快速上手JavaScript编程。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.JavaScript的组成

JavaScript是一种运行在客户端的脚本语言，JS的组成有ECMAScript、DOM、BOM

1.1ECMAScript

ECMAScript是ECMA国际进行标准化的一门编程语言，这种语言在万维网上应用广泛，它往往被称为JavaScript或JScript，但实际上后两者是ECMAScript语言的实现和扩展

ECMAScript规定了JS的编程语法和基础核心知识，是所有浏览器厂商共同遵守的一套JS语法工业标准

1.2DOM

文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标记语言的标准编程接口，通过DOM提供的接口可以对页面上的各种元素进行操作（大小、位置、颜色等）

1.3BOM

BOM（Browser Object Model，简称BOM）是指浏览器对象模型，它提供了独立于内容的、可以与浏览器窗口进行互动的对象结构，通过BOM可以操作浏览器窗口，比如弹出框、控制浏览器跳转、获取分辨率等

2.JS引入方式

2.1行内式

<input type="button" value="点我试试" onclick="alert('Hello World')"/>

可以将单行或少量JS代码写在HTML标签的事件属性中（以on开头的属性），如onclick
注意单双引号的使用：在HTML中我们推荐使用双引号，JS中我们推荐使用单引号
可读性差，在HTML中编写大量JS代码时，不方便阅读
引号易错，引号多层嵌套匹配时，非常容易混淆

2.2内嵌式

<script>
    alter('hello world');
</script>

可以将多行JS代码写到<script>标签中

2.3外部式

<script scr="JS文件路径"></script>

利用HTML页面代码结构化，把大段JS代码独立到HTML页面之外，既美观，也方便文件级别的复用
引用外部JS文件的script标签中间不可以写代码
适合于JS代码量比较大的情况

3.JS注释

3.1单行注释

//注释内容

3.2多行注释

/*注释内容*/

4.JS输入输出语句

方法	说明	归属
alert(msg)	浏览器弹出警示框	浏览器
console.log(msg)	浏览器控制台打印输出信息	浏览器
prompt(info)	浏览器弹出输入框，用户可以输入	浏览器

5.变量

变量是程序在内存中申请的一块用来存放数据的空间，我们通过变量名获取数据和修改数据

5.1声明变量

var 变量名;//var是一个JS关键字，用来声明变量

5.2赋值

变量名=值;//右边的值赋值给左边的变量空间中

5.3变量的初始化

var 变量名=值;

声明变量的同时赋值

var 变量名=prompt('请输入内容：');
alert(变量名);

5.4更新变量

一个变量被重新赋值后，它原有的值就会被覆盖

var 变量名=值1;
变量名=值2;//此时变量的值为值2

5.5同时声明多个变量

同时声明多个变量时，只需要写一个var，多个变量名之间使用英文逗号隔开

var 变量名1=值1, 变量名2=值2, 变量名3=值3;

声明变量的特殊情况

情况	说明	结果
var 变量名;console.log(变量名);	只声明不赋值	underfined（未定义的）
console.log(变量名);	不声明不赋值，直接使用	报错
变量名=值;console.log(变量名);	不声明只赋值	JS中是可以使用的，但是不提倡

5.6变量的命名规范

由字母、数字、下划线、美元符号组成
严格区分大小写
不能以数字开头
不能是关键字、保留字
变量名必须有意义，方便理解和阅读
遵守驼峰命名法，即首字母小写，后面单词的首字母大写

6.数据类型

JS的变量数据类型只有程序在运行过程中根据等号右边的值来确定的，JS拥有动态类型，同时也意味着相同的变量可用作不同的类型

6.1Number数字型

Number数字型，包含整型值和浮点型值，默认值为0

数字型进制：二进制0d，8进制0，十六进制0x开头
数字型的最大值Number.MAX_VALUE(1.7976931348623157e+308),最小值Number.MIN_VALUE(5e-324)
数字型三个特殊值：Infinity（无穷大）、-Infinity（无穷小）、NaN或Not a number（一个非数值）
方法isNaM()用来判断非数字，如果是数字返回false，如果不是数字返回ture

6.2Boolean 布尔值类型

Boolean布尔值类型，如true、false，等价于1和0，默认值为false

字符串型可以是引号中的任意文本，其语法未双引号和单引号
布尔型和数字型相加的时候，true的值为1，false的值为0

6.3String 字符串类型

String字符串类型，在js中字符串都带引号 ""

6.3.1字符串转义符

转义符	解释说明
\n	换行符
\\	斜杠\
\'	'单引号
\"	"双引号
\t	tab缩进
\b	空格

6.3.2字符串长度

通过字符串的length属性可以获取整个字符串的长度

alter(变量名.length);//输出字符串长度

6.3.3字符串拼接

多个字符串之间可以使用+进行拼接，其拼接方式为字符串+任何类型=拼接之后的新字符串

alter('hello'+' '+'world');//hello world"

拼接前会把字符串相加的任何类型转成字符串，再拼接成一个新的字符串
要是两个都是数值型则相加，要是有一个是字符串型则相连

6.4Underfined

undefined只声明未赋值，默认值为undefined

一个声明后没有被赋值的变量会有一个默认值undefined
undefined和数字相加最后的结果是NaN

6.5Null

Null空值，默认值为null

一个声明变量给null值，里面存的值为空
空值和数字相加返回的还是原数字

6.6获取变量的数据类型

typeof可用来获取检测变量的数据类型

console.log(typeof 变量名);

null的返回值为object