前端快速入门——JavaScript变量、控制语句

1.JavaScript 定义

JavaScript 简称 JS.
JavaScript 是一种轻量级、解释型、面向对象的脚本语言。它主要被设计用于在网页上实现动态效果，增加用户与网页的交互性。
作为一种客户端脚本语言，JavaScript 可以直接嵌入 HTML，并在浏览器中执行。与 HTML和 CSS 不同，JavaScript 使得网页不再是静态的，而是可以根据用户的操作动态变化的。

2.JavaScript 作用

JavaScript 在前端开发中扮演着重要的角色，其应用领域包括但不限于:
客户端脚本：用于在用户浏览器中执行，实现动态效果和用户交互
网页开发：与 HTML和 CSS 协同工作，使得网页具有更强的交互性和动态性
后端开发：使用 Node.js，JavaScript 也可以在服务器端运行，实现服务器端应用的开发。

3.JavaScript 导入方式

（1）内联

<body><h1>JS导入方式</h1><script>console.log('hello world')</script>
</body>
<!-- 或者在head中写 -->

在浏览器中按F12即可
在这里插入图片描述
（2）外联

<head><script src="/myscript.js"></script>
</head>

myscript.js

console.log('Hello, world! This is a simple JavaScript file.');

在这里插入图片描述

4.JavaScript变量与数据类型

JavaScript 有三种变量声明方式：
var：声明一个变量，可选择将其初始化为一个值。
let：声明一个块级作用域的局部变量，可选择将其初始化为一个值。
const：声明一个块级作用域的只读命名常量。

在应用程序中，你将变量用作值的符号名。变量的名字又叫做标识符，其需要遵守一定的规则。
JavaScript 标识符通常以字母、下划线（_）或者美元符号（$）开头；后续的字符也可以是数字（0-9）。因为 JavaScript 是区分大小写的，所以字母包含从 A 到 Z 的大写字母和从 a 到 z 的小写字母。

<body><script>var x;let y=5;const z=10;let name ='你好'console.log(x,y,z,name);console.log(typeof x,typeof y,typeof z,typeof name);</script>  
</body>

在这里插入图片描述

5.JavaScript控制语句

（1）条件语句
在这里插入图片描述

 <script>let time=12;if(time<12){console.log('还可以再玩一会儿')}else{console.log('该睡觉了')}</script>

（2）循环
在这里插入图片描述

    <script>        let sum=0for(let i=0;i<10;i++){sum +=i;}console.log(sum);</script>

在这里插入图片描述

    <script>let sum=0;while(sum<10){sum +=1;}console.log(sum);</script>

在这里插入图片描述

    <script>for(let i=0;i<10;i++){if(i%2==0){console.log(i+'是偶数');continue; // 跳过当前循环的剩余部分，继续下一次循环}if(i==5){console.log('跳出循环');break; // 终止整个循环}console.log(i);}</script>