首页 > 其他分享 >CH02_JS变量和数据类型

CH02_JS变量和数据类型

时间:2024-07-02 11:28:29浏览次数:3  
标签:变量 数据类型 CH02 var JS 声明 赋值

第2章:JS中的变量和数据类型

本章目标

  1. 掌握变量的概念
  2. 掌握如何使用变量
  3. 掌握javascript中的数据类型

课程回顾

  1. js的三种使用方式?
  2. js的注释有那些?

讲解内容

1. 为什么要使用变量?

  1. 问题:人类是靠什么要记忆(记录数据)?

    大脑、作笔记等

  2. 问题:计算机如果要保存数据,靠什么来保存?

    硬件课程中讲到:内存条、硬盘、U盘等存储设备

    那么运行的程序要保存数据主要是靠内存条来存储。

  3. 问题:内存条又是如何要保存数据呢?

    变量和数据类型,就是讲解计算机如何通过内存来保存数据

2. 变量

  1. 概念:变量是指程序中一个已经命名的储存单位,它的主要作用就是为数据操作提供存放信息的容器。

    简单理解:变量是用于存储信息的"容器"。

    在这里插入图片描述

    那么:如果年龄变大:18,身高为:175,在内存中如何表示呢?

    在这里插入图片描述

    说明:保存在内存中的数据可以发生变化

    注意事项:

    1. 变量,则保存在内存中的数据可以发生变化(可以修改数据)
    2. 变量之间是相互独立,互不干扰。
  2. 问题:现在我们把数据保存在内存中,那么如何获取到年龄或身高等数据呢?

    比如说,班上有30名学生,我想找一个学生回答问题怎么办?

    通过叫学生的“名字”,比如说:张三 起来回答问题

    那么相同的道理,我们能不能给年龄或身高也在程序中取一个“名字”,这个名字则为“变量名”

    比如说:age为年龄,height为身高

    在这里插入图片描述

  3. 变量名命名规则:

    变量名又称标识符,所有 JavaScript 变量必须以唯一的名称标识

    这些唯一的名称称为标识符

    (1).必须以字母或下划线(_)开头,中间可以是数字、字母或下划线;

    (2).变量名不能包括空格、加、减等符号;

    (3).不能使用JS中关键字作为变量名,如int,new等;

    (4).JS的变量名严格区分大小写;

  4. 变量的使用步骤:

    1. 声明变量:关键字为var

      var age;

      var height;

      可以同时声明多个变量,如下:

      var a , b ,c;

    2. 给变量赋值:赋值运算符=

      age=16;

      height=170;

      可以同时给多个变量赋值,如下:

      a=10,b=20,c=30;

      注意事项:第1和第2步可以一步实现

      声明变量且赋值:

      var age=20;

      var height=170;

      var a=20, b=30,c=40;

    3. 使用

      document.write("年龄:"+age);

      console.log("身高:"+height);

      完整代码:

         	<script>
              //1:声明变量
              var age;
              var height;
              //2:给变量赋值
              age=16;
              height=170;
              //3:使用,可以把年龄打印出来
              document.write("年龄:"+age);
              console.log("身高:"+height);
          </script>
      

      运行效果:

    在这里插入图片描述

  5. 变量声明时,需要遵循以下规则:

    1. 可以使用一个关键字var同时声明多个变量,只需要用逗号(,)分隔变量名就行了,如:

      var a,b,c //同时声明a、b、c三个变量,在JS中符号都是英文状态下的符号。

    2. 可以在声明变量的同时对其赋值,即初始化变量,如:

      var a=1,b=2,c=3; //同时声明a、b、c三个变量,并分别对其进行了初始化

    3. 使用var语句多次声明同一个变量,如果重复声明的变量已经有一个初始值,那么此时的声明就相当于对变量的重新赋值,如:

      var a=10;

      var a=20;

      此时a的值为20,相当于重新赋了一个20的值

    4. JS中采用的是弱类型的形式,所以可以不理会变量的数据类型,即可把任意类型的数据赋值给变量。如:

      var a=100; //数值类型

      var str=“嗨,海绵宝宝”; //字符串类型(字符串类型在声明及使用时都要用双引号引起来)

      var b=true; //布尔类型

    5. 在JS中,变量可以先不声明,而是在使用时,根据变量的实际作用来确定其所属的数据类型。但是由于JS采用动态编译,在变量命名方面并不容易发现代码错误,所以建议在使用变量前就对其声明,以便能够及时发现代码中的错误。

3. 数据类型

  1. 什么是数据类型

    数据类型就是将各种数据进行分类

  2. 数据类型分类

    1. 值类型(基本数据类型)

      字符串(String)、数字(Number)、布尔(Boolean)、对空(Null)、未定义(Undefined)。

    2. 引用数据类型(后面课程重点讲解)

      对象(Object)、数组(Array)、函数(Function)。

  3. 详细讲解数据类型

    1. 字符串类型(String)

      字符串是存储字符(比如 “Bill Gates”)的变量。

      字符串可以是引号中的任意文本。您可以使用单引号或双引号

      var carname="Volvo XC60";
      var carname='Volvo XC60';
      
    2. 数字类型(Number)

      JavaScript 只有一种数字类型。数字可以带小数点,也可以不带:

      var x1=34.00;      //使用小数点来写
      var x2=34;         //不使用小数点来写
      
    3. 布尔类型(Boolean)

      布尔(逻辑)只能有两个值:true 或 false。

      var x=true;
      var y=false;
      
    4. 未定义或赋值(Undefined)

      Undefined 这个值表示变量不含有值

      在这里插入图片描述

    5. 对空( Null)

      可以通过将变量的值设置为 null 来清空变量。

  4. typeof关键字

    作用:typeof检测变量的返回值

    undefined:变量被声明后,但未被赋值
    string:用单引号或双引号来声明的字符串
    boolean:true或false
    number:整数或浮点数
    object:javascript中的对象、数组和null

在这里插入图片描述

课后作业

1.苹果公司发布新款手机,包含品牌、型号、内存、颜色、价格、像素等信息,请用变量存储相关参数并输出出来。

2.用变量data接收prompt()函数输入的数据,然后检测变量的类型并输出。

标签:变量,数据类型,CH02,var,JS,声明,赋值
From: https://blog.csdn.net/m0_37631902/article/details/140122018

相关文章

  • 035基于SSM+Jsp的二手交易平台网站
    开发语言:Java框架:ssm技术:JSPJDK版本:JDK1.8服务器:tomcat7数据库:mysql5.7(一定要5.7版本)数据库工具:Navicat11开发软件:eclipse/myeclipse/ideaMaven包:Maven3.3.9系统展示商家首页个人中心商品信息管理管理员登录管理员首页用户管理商家管理商品信息管理论坛管理......
  • Vue.js 安装
     1、独立版本我们可以在Vue.js的官网上直接下载vue.min.js并用 <script> 标签引入。2、使用CDN方法以下推荐国外比较稳定的两个CDN,国内还没发现哪一家比较好,目前还是建议下载到本地。StaticfileCDN(国内) : https://cdn.staticfile.net/vue/2.2.2/vue.min.js......
  • Vue.js 目录结构
     上一章节中我们使用了npm安装项目,我们在IDE(Eclipse、Atom等)中打开该目录,结构如下所示: 目录解析目录/文件说明build项目构建(webpack)相关代码config配置目录,包括端口号等。我们初学可以使用默认的。node_modulesnpm加载的项目依赖模块src这里是我们要开发的目录,基......
  • js限制文本框输入数字
    <!--input只允许输入整数--><inputtype="text"name="a"onkeyup="value=value.replace(/[^\d]/g,'')"><!--input只允许输入整数和小数(小数只保留小数点后两位)--><inputtype="text"name="aa"onkeyup="......
  • PHP与js遍历的区别,PHP运行原理学习
    <!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title><?phpecho'PHP的第一......
  • Three.js 给对象创建轮廓效果
    需求:1、选定某个对象后,给该对象一个整体轮廓效果。需求插件:Three.js,postprocessing,vue2实现方案:以前还是需要自己写的、现在可以直接用插件了,就是上面这个postprocessing插件,使用也蛮简单的,初始化好插件后、在需要使用的地方这样写就行this.outlinePass.selectedObjects=......
  • fastjson整理思路
    此处把常用的一些方法,简单做个记录。 做自动化时,我们发送一个请求,返回的是一个字符串。首先我们要把这个字符串转换为json对象  parseObject():将JSON字符串解析为Java对象。 Stringjson="{\"person\":{\"name\":\"Ivy\",\"age\":60}}";JSONO......
  • 基于javaweb jsp ssm民宿住宿管理系统毕业设计实战项目分享
    前言......
  • 基于javaweb jsp ssm基于分类算法的学业警示预测毕业设计实战项目分享
    前言......
  • 华为OD机试D卷 --智能成绩表--24年OD统一考试(Java & JS & Python & C & C++)
    文章目录题目描述输入描述输出描述用例题目解析算法源码题目描述小明来到某学校当老师,需要将学生按考试总分或单科分数进行排名,你能帮帮他吗?输入描述第1行输入两个整数,学生人数n和科目数量m。0<n<1000<m<10第2行输入m个科目名称,彼......