JavaScript - 变量

最新推荐文章于 2024-10-11 17:39:47 发布

Henry_ww

最新推荐文章于 2024-10-11 17:39:47 发布

阅读量148

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/Henry_ID/article/details/119175934

版权

变量

1.1-变量声明/赋值/取值

1.实际开发因为数据是动态变化，不可能写死数据，因此需要使用变量来进行保存
2.变量（variable）：内存中用来保存数据的一块空间
3.变量作用：在内存中存储数据
4.语法:
- 1.声明变量:let 变量名
- 2.赋值：变量名 = 值
- 3.取值：直接写变量名即可

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script>
    /* 
        1.变量(variable)作用 ： 在内存中 存储数据

        2.变量语法
            a. 声明变量  ：  var 变量名;
            b. 变量赋值  ：  变量名 = 值
            c. 变量取值  :   变量名 

    */

    //需求：弹出一个输入框，保存用户输入的数据，并且在控制台打印
    //使用变量来保存数据
    let age = prompt('请输入你的年龄');
    console.log ( age );

    //1. 变量的作用：在内存中存储数据
    //变量(variable)本质：内存中的一块空间

    //2. 变量语法

    //2.1 声明变量 ：   let 变量名;
    let a;//let 关键字的作用就是内存开辟一块空间，这个空间的名字叫做a

    //2.2 变量的赋值：  变量名 = 数据
    //= ：赋值运算符：将右边的数据赋值给左边的变量
    a = 10;

    //2.3 变量的取值：直接使用变量名
    console.log ( a );//10

    //注意：这里打印的是a这个字符串，而不是变量a
    console.log ( 'a' );

</script>
</body>
</html>

图解变量工作原理

在这里插入图片描述

1.2-变量补充说明

本小节知识点
- 1.变量的初始化
- 2.变量的批量声明
- 3.变量批量声明赋值
- 4.变量的重复声明
- 5.变量的重复赋值
- 6.变量的值是另一个变量的值
- 7.JS老版本var声明变量
- 8.let和var的区别

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

<script>
    /* 
        1.变量(variable)作用 ： 在内存中 存储数据

        2.变量补充说明
            a. 变量初始化
                语法： let 变量名 = 值;
            b. 变量重复声明
                语法 : let 变量名 = 值;
                特点 : 覆盖已经存在的变量
            c. 变量重新赋值
                语法 : 变量名 = 值;
                特点 : 先销毁旧值，然后存入新值
            d. 变量的值是另一个变量
                语法 : 变量名a = 变量名b
                特点 : 将变量b中的数据， 拷贝一份赋值给a

    */


    //1.变量的初始化：在声明的时候赋值
    let num = 10;//相当于(1)  let num;   (2)num = 10   这两行代码简写形式

    //2.变量的批量声明：同时声明多个变量
    let a,b,c;

    //3.批量声明的时候也可以赋值
    let num1 = 10,num2 = 20,num3 = 30;

    //4.变量的重复赋值：修改变量里面存储的数据
    num = 99;
    console.log ( num );//99

    //5.变量的值是另一个变量的值
    let n1 = 20;
    let n2 = n1;//将n1的值拷贝一份赋值n2
    console.log (  n2 );//20
    console.log ( n1 );//20

    //注意：这行代码的意思是将字符串'n1'赋值给变量n2，而不是变量n1的值
    //n2 = 'n1';
    //console.log ( n2 );//n1
    
    //6.var也可以声明变量，与let使用方法一样
    var n3 = 3;
    
    //7.let和var的区别：let同名变量只能声明一次，var可以声明多次（干掉原来的）
    let n4 = 4;
    //let n4 = 40;		// 错误：已经定义过，不能再定义
    var n5 = 5;
    var n5 = 50;		// 没问题：第二个n5会重新开辟内存，第一个n5被干掉（浪费内存）

    // 总结：实际开发的时候，我们都是使用let开发，很少使用var了
</script>
</body>

</html>

图解变量补充说明

在这里插入图片描述

1.3-变量命名规则与规范

规则：必须要遵守，否则会报错
- 规则是由语法决定的，无法更改
  - 1.变量只能以下划线、字母、$开头，后面接任意的数字、下划线、字母、$
  - 2.不能以JS的关键字作为变量名
    - 尽量不要使用关键字和保留字作为变量名，也不需要死记硬背，孰能生巧
    - 关键字：JS内置的一些关键字，代表着特殊的语法含义，不允许程序员擅自声明
    - 保留字：有可能在将来会成为关键字，现在可以用，但是并不能保证以后一直可以用
规范：程序员们在遵守规则时养成的一种习惯
- 规范是程序员的一种编码习惯，主要目的就是为了提高代码的易读性
  - 1.起名要有意义，最好用名词作为变量名
  - 2.使用驼峰命名法：变量名第一个单词首字母小写，后面如果有其他单词则每一个单词的首字母大写

在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>

<script>
    /* 
        1.变量(variable)作用 ： 在内存中 存储数据

        2.变量命名规则
            * 3.1规则：必须要遵守，否则会报错。由语法决定
                * 1.变量只能以下划线、字母、$开头，后面接任意的数字、下划线、字母、$
                * 2.不能以JS的关键字作为变量名
                * 3.js是严格区分大小写的， 例如：age与Age这是两个不同的变量名
            * 3.2规范: 大家都遵守的一种编码习惯，主要是为了提高代码的易读性
                * 1.起名要有意义，最好用名词作为变量名
     *          * 2.使用驼峰命名法：变量名第一个单词首字母小写，后面如果由其他单词则每一个单词的首字母大写

    */

    //1.这样命名虽然不会报错，但是代码一多，你自己都不知道是用来保存什么数据，别人看你代码也是一脸懵逼
    let ababababababbabab = "我就是这条街最靓的仔";
    //2.这样写代码会报错，因为不是以下划线、字母、$开头
    //let 123str = "123";
    //let #666 = "666";
    //3.这样写符合规则，不会报错
    let _123$$$_ssss6666 = "what?";
    //4.命名规范演示
    let age = 18;				//年龄
    let name = "张三";		   //姓名
    let userName = "admin";		//用户名  驼峰命名法
    let passWord = "123456";	//密码 驼峰命名法
    let gender = "男";			//性别的英语单词
    let pwd = "1314520";		//密码password的简写
    let oldFe = "老铁";		   //极其个别的英语名词不知道可以使用中文代替

</script>
</html>