JavaScript 介绍 & 变量 & 类型转换-CSDN博客

本文链接：https://blog.csdn.net/Kideers/article/details/129889257

这篇博客详细介绍了JavaScript的基础知识，包括JavaScript的介绍、书写位置、注释、输入输出语法，重点讲解了变量的声明、使用及let和var的区别，还涵盖了数据类型如number、string、boolean、undefined和null。此外，讨论了类型转换的必要性和方法，包括隐式转换和显式转换，并提供了实战案例分析。

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

JavaScript 介绍 & 变量 & 类型转换

文章目录

JavaScript 介绍 & 变量 & 类型转换
[一] JavaScript 介绍
- 概念
- 作用
- 组成
- 总结
JavaScript 书写位置
- 内部 JavaScript
- 外部 JavaScript
- 行内 JavaScript
- 总结
JavaScript 注释 & 结束符
- 单行注释
- 多行 / 块注释
- 结束符
JavaScript 输入输出语法
- 输出语法
- 输入语法
- JavaScript 代码执行顺序
- 字面量
总结
[二] JavaScript 变量
- 概念
- 变量的声明和赋值
- 变量的基本使用
- 变量的本质
- 变量命名规则与规范
- - 规则
  - 规范
- 变量拓展 - let 和 var 的区别
- 数组
- 数组的基本使用
[三] JavaScript 常量
- 常量的基本使用
- 总结
[四] 数据类型
- 概念
- 1. 数字类型 nubmer
- 2. 字符串类型 string
- 3. 布尔类型 boolean
- 4. 未定义类型 Undefined
- 5. 空类型 null
- 总结
- 检测数据类型
- - typeof
[五] 类型转换
- 为什么需要类型转换
- 隐式转换
- 显式转换
- - 转换为数字型
  - 转换为字符型
- 总结
实战案例
- 用户订单信息案例
课后练习

[一] JavaScript 介绍

概念

JavaScript 是一种运行在 客户端（浏览器） 的编程语言，实现人机交互效果

在这里插入图片描述

作用

网页特效（监听用户的一些行为让网页作出对应的反馈）
表单验证（针对表单数据的合法性进行判断）
数据交互（获取后台的数据，渲染到前端）
服务端编程 (node.js)

组成

Google: MDN

JavaScript 权威网站：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript

ECMAScript
- 规定了 JS 基础语法核心知识
- 比如：变量、分支语句、循环语句、对象等
Web APIs
- DOM 操作文档，比如对页面元素进行移动、大小、添加删除等操作
- BOM 操作浏览器，比如页面弹窗，检测窗口宽度、存储数据到浏览器等

在这里插入图片描述

总结

JavaScript 概念：

JavaScript 是一种运行在 客户端（浏览器） 的编程语言，实现人机交互效果

JavaScript 组成：
1. ECMAScript
2. Web APIs
  1. DOM
  2. BOM

JavaScript 书写位置

在这里插入图片描述

内部 JavaScript

直接写在 html 文件里，用 script 标签包住

规范：script 标签写在 </body> 上面

页面弹出警告对话框：alert('Hello, World'，js)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button>按钮 1</button>
    <button>按钮 2</button>
    <button>按钮 3</button>
    <button>按钮 4</button>

    <!-- 内部 JS -->
    <script>
        alert("Hello, World")
    </script>
</body>
</html>

P.S. 我们将 <script> 放在 HTML 文件的底部附近的原因是浏览器会按照代码在文件中的顺序加载 HTML

如果先加载的 JavaScript 期望修改其下方的 HTML,那么它可能由于 HTML 尚未被加载而失效

因此，将 JavaScript 代码放在 HTML 页面的底部附近通常是最好的策略

外部 JavaScript

代码写在以 .js 结尾的文件里

语法：通过 script 标签，引入到 html 页面中

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>

    <!-- 外部 JS -->
    <script src="./js_external.js">
        // P.S. 中间不要写代码，会被忽略
    </script>

</head>
<body>
    <button>按钮 1</button>
    <button>按钮 2</button>
    <button>按钮 3