(JavaScript学习记录):变量

目录

变量概述

变量的使用

声明变量

赋值

变量的初始化

案例1

案例2

变量语法扩展

更新变量

同时声明多个变量

声明变量特殊情况

变量命名规范

案例:交换两个变量的值

小结


变量概述

什么是变量

  • 白话:变量就是一个装东西的盒子。
  • 通俗:变量是用于存放数据的容器。 我们通过 变量名 获取数据,甚至数据可以修改。

  • 变量在内存中的存储

    • 本质:变量是程序在内存中申请的一块用来存放数据的空间
    • 类似我们酒店的房间,一个房间就可以看做是一个变量。

变量的使用

  • 变量在使用时分为两步:
    • 1. 声明变量 
    • 2. 赋值

声明变量

// 声明变量 
var age; // 声明一个 名称为age 的变量
  • var 是一个 JS关键字,用来声明变量( variable 变量的意思 )。
    • 使用该关键字声明变量后,计算机会自动为变量分配内存空间,不需要程序员管
  • age 是程序员定义的变量名,我们要通过变量名来访问内存中分配的空间

赋值

age = 10; // 给 age 这个变量赋值为 10
  • = 用来把右边的值赋给左边的变量空间中 此处代表赋值的意思
  • 变量值是程序员保存到变量空间里的值

变量的初始化

var age = 18; // 声明变量同时赋值为 18
  • 声明一个变量并赋值, 我们称之为变量的初始化。

案例1

<script>
    // 1. 声明了一个age 的变量 
    var age;
    // 2. 赋值  把值存入这个变量中
    age = 18;
    // 3. 输出结果 
    console.log(age);
    // 4. 变量的初始化 
    var myname = 'pink老师';
    console.log(myname);
</script>

案例2

  • 需求:
    • 1. 弹出一个输入框,提示用户输入姓名。
    • 2. 弹出一个对话框,输出用户刚才输入的姓名。
<script>
    // 1. 用户输入姓名  存储到一个 myname的变量里面
    var myname = prompt('请输入您的名字');
    // 2. 输出这个用户名
    alert(myname);
</script>

变量语法扩展

更新变量

  • 一个变量被重新复赋值后,它原有的值就会被覆盖,变量值将以最后一次赋的值为准
//  更新变量
var myname = 'pink老师';
console.log(myname);
myname = '迪丽热巴';
console.log(myname);

同时声明多个变量

  • 同时声明多个变量时,只需要写一个 var, 多个变量名之间使用英文逗号隔开
// 声明多个变量
// var age = 18;
// var address = '火影村';
// var gz = 2000;
var age = 18,
    address = '火影村',
    gz = 2000;

声明变量特殊情况

//  声明变量的特殊情况
//  只声明不赋值 结果是?  程序也不知道里面存的是啥 所以结果是 undefined  未定义的
var sex;
console.log(sex); // undefined
// 不声明 不赋值 直接使用某个变量会报错滴
console.log(tel);
//  不声明直接赋值使用
qq = 110;
console.log(qq);

变量命名规范

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

案例:交换两个变量的值

  • 要求:交换两个变量的值 ( 实现思路:使用一个 临时变量 用来做中间存储 )
var temp; // 声明了一个临时变量
var apple1 = '青苹果';
var apple2 = '红苹果';
temp = apple1; // 把右边给左边
apple1 = apple2;
apple2 = temp;
console.log(apple1);
console.log(apple2);

小结

猜你喜欢

转载自blog.csdn.net/baidu_41388533/article/details/108582299
今日推荐