JavaScript变量概述

最新推荐文章于 2024-11-13 17:27:29 发布

ashore465

最新推荐文章于 2024-11-13 17:27:29 发布

阅读量42

点赞数 1

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/weixin_75197203/article/details/134205153

版权

1.什么是变量

1.1什么是变量

大白话来说：变量就是一个装东西的盒子

通俗来讲：变量是用于存放数据的容器，我们通过变量名获取数据，甚至数据可以修改。

1.2变量在内存中的存储

本质：变量是程序在内存中申请的一块用来存放数据的空间

2.变量的使用

1.1声明变量

var age;//声明了一个age的变量

var是一个JS关键字，用来声明变量（variable变量的意思）。使用该关键字声明变量后，计算机会自动为变量分配内存空间，不许要程序管理。

age是程序员定义的变量名，我们要通过变量名来访问内存中分配的空间

1.2变量的赋值

age=18;

=用来把右边的值赋给左边的变量空间中此处代表赋值的意思

变量值是程序员保存到变量空间里的值

1.3变量的初始化

var name="dly";

在声明变量的同时给变量赋值

案例1（弹出一个输入框，来输入变量值，弹出一个对话框，用来输出变量值）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var myname=prompt('请输入您的姓名')
        var age=prompt('请输入您的年龄')
        var emial=prompt('请输入您的邮箱')
        var adress=prompt('请输入您的家庭住址')
        var salary=prompt('请输入您的工资')
        alert("我叫"+myname+",我住在"+adress+",我今年"+age+"岁"+",我的邮箱是"+emial+",我的工资是"+salary)
        //控制台输出
        console.log("我叫"+myname+",我住在"+adress+",我今年"+age+"岁"+",我的邮箱是"+emial+",我的工资是"+salary)
    </script>
</head>
<body>
    
</body>
</html>

运行结果：

案例2（定义变量，并且输出其变量值）：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var myname="旗木卡卡西";
        var age=30;
        var adress="黄河";
        var emial="313@qq.com";
        var salary=2000;
        console.log("我叫"+myname+",我住在"+adress+",我今年"+age+"岁"+",我的邮箱是"+emial+",我的工资是"+salary)
    </script>
</head>
<body>
    
</body>
</html>

运行结果：

3.变量语法扩展

1.变量的更新

一次变量被从新赋值后，原本的变量值会被覆盖，以最后一次变量值为准

代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var age=18;
        age=20;
        alert('您的年龄是'+age)
    </script>
</head>
<body>
    
</body>
</html>

运行结果：

2.声明多个变量

var myage=18；
var adress="19";
var myname="lzw";

或者：

var myage=18,
    adress="313",
    myname="dly";

使用一个var，变量之间用逗号隔开，在最后的变量的后面加上分号。

4.变量的特殊使用情况

1.只声明，不赋值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //1.只声明，不赋值
        var name;
        console.log(name)
    </script>
</head>
<body>
    
</body>
</html>

运行的结果是没有定义

2.不声明，不赋值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //1.只声明，不赋值
        var name;
        alert(name)
        //2.不声明，不赋值
        console.log(age)
    </script>
</head>
<body>
    
</body>
</html>

运行结果：

3.不声明，只赋值

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        //1.只声明，不赋值
        var name;
        alert(name)
        //2.不声明，不赋值
        // console.log(age)
        //3.不声明，只赋值
        qq=123;
        console.log(qq)
    </script>
</head>
<body>
    
</body>
</html>

运行结果：

可以运行，但是不符合规范。

5.变量的命名规范

由字母(A-Za-z)、数字(0-9)、下划线()、美元符号(S)组成，如: usrAge,num01,name。
严格区分大小写。var app;和 var App;是两个变量
不能以数字开头。18age 是错误的
不能是关键字、保留字。例如 :vr、for、while
变量名必须有意义。MMD BBDn-age
遵守驼峰命名法。首字母小写，后面单词的首字母需要大写。 myFirstName
推荐翻译网站:百度

代码案例：

 var app=10;
        var App=100;
        console.log(app+" "+App)
        // var 19age;不能以数字开头会报错
        // var var;不能以关键字来声明变量，会报错

6.交换两个变量的值

代码案例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        var name1="红苹果";
        var name2="青苹果";
        //定义一个空变量，相当于一个空盒子，用来更换变量。
        var name3=""
        name3=name1;
        name1=name2;
        name2=name3;
        console.log(name1)
        console.log(name2)
    </script>
</head>
<body>
    
</body>
</html>

详细过程：