1. JavaScript变量和数据类型

1.0 js变量和数据类型

  • 在我们平时开发中,使用最多的并不是固定的数据, 而是会变换的数据:

    • 比如购物车商品的数量、价格的计算等等;
    • 比如一首歌曲播放的时间、进度条、歌词的展示等等;
    • 比如微信聊天中消息条数、时间、语音的长度、头像、名称等等;
    • 比如游戏中技能的冷却时间、血量、蓝量、buff时间、金币的数量等等;

1.1 变化数据的记录-变量

  • 如果我们希望记录某一个之后会变量的数据,在JavaScript中我们可以定义一个 变量

    • 一个变量,就是一个用于存放数值的容器
    • 这个数值可能是一个用于计算的数字,或者是一个句子中的字符串,或者其他任意的数据;
    • 变量的独特之处在于 它存放的数值是可以改变的
  • 我们可以把变量想象成一个盒子,盒子里面装着我们的数据,我们需要给盒子进行一个特性的名称即变量名。
    • 例如,变量 message 可以被想象成一个标有 “message” 的盒子,盒子里面的值为 “Hello!”;
    • 并且,这个盒子的值,我们想改变多少次,就可以改变多少次;

1.2 变量的命名格式

  • 在JavaScript中如何命名一个变量呢?包含两部分:

    • 变量的声明:在JavaScript中声明一个变量使用var关键字(variable单词的缩写)(后续学习ES6还有let、const声明方式)
    • 变量的赋值:使用 = 给变量进行赋值;
  • 这个过程也可以分开操作:

  • 同时声明多个变量:

1.3 变量的命名规范

  • 变量命名规则:必须遵守

    • 第一个字符必须是一个字母、下划线( _ )或一个美元符号( $ )不能是数字
    • 其他字符可以是字母、下划线、美元符号或数字
    • 不能使用关键字和保留字命名:
      • 什么是关键字,什么是保留字?
      • https://developer.mozilla.org/zh-CN/docs/web/javascript/reference/lexical_grammar
    • 变量严格区分大小写
  • 变量命名规范:建议遵守
    • 多个单词使用驼峰标识;
    • 赋值 = 两边都加上一个空格;
    • 一条语句结束后加上分号; 也有很多人的习惯是不加;
    • 变量应该做到见名知意;

1.4 变量的使用注意

  • 注意一:如果一个变量未声明(declaration)就直接使用,那么会报错;
  • 注意二:如果一个变量有声明,但是没有赋值,那么默认值是undefined
  • 注意三:如果没有使用var声明变量也可以,但是不推荐(事实上会被添加到window对象上)

1.5 JavaScript的数据类型

  • JavaScript 中的值都具有特定的类型。

    • 例如,字符串或数字。
    • 我们可以将值赋值给一个变量,那么这个变量就具备了特定的类型;
    • 一个变量可以在前一刻是个字符串,下一刻就存储一个数字;
    • 允许这种操作的编程语言,例如 JavaScript,被称为“动态类型”(dynamically typed)的编程语言;
  • 在 JavaScript 中有 8 种基本的数据类型(7 种原始类型和 1 种复杂类型)

    • Number
    • String
    • Boolean
    • Undefined
    • Null
    • Object
    • BigInt(后续了解)
    • Symbol(后续了解)

1.6 typeof 操作符

  • 因为 ECMAScript 的类型系统是松散的,所以需要一种手段来确定任意变量的数据类型。

    • typeof 操作符就是为此而生的。这个是一个操作符而不是一个函数
  • 对一个值使用 typeof 操作符会返回下列字符串之一:
    • "undefined"表示值未定义;
    • "boolean"表示值为布尔值;
    • "string"表示值为字符串;
    • "number"表示值为数值;
    • "object"表示值为对象(而不是函数)或null重要;
    • "function"表示值为函数;
    • “symbol”表示值为符号;
  • typeof()的用法:
    • 你可能还会遇到另一种语法:typeof(x),它与 typeof x 相同;
    • typeof是一个操作符,并非是一个函数,()只是将后续的内容当做一个整体而已

1.7 Number类型(一)

  • number 类型代表整数和浮点数。
  • 数字number可以有很多操作,比如,乘法 、除法、加法 +、减法 - 等等。
    • 常见的运算符后续会专门讲解
  • 除了常规的数字,还包括所谓的“特殊数值(“special numeric values”)”也属于Number类型(了解)
    • Infinity:代表数学概念中的 无穷大 ∞,也可以表示-Infinity;

      • ✓ 比如 1/0 得到的就是无穷大;
    • NaN:NaN 代表一个计算错误,它是一个错误的操作所得到的结果;
      • ✓ 比如 字符串和一个数字相乘;

1.8 Number类型(二)

  • 数字表示的范围:

    • 最小正数值:Number.MIN_VALUE,这个值为: 5e-324,小于这个的数字会被转化为0
    • 最大正数值:Number.MAX_VALUE,这个值为: 1.7976931348623157e+308
  • isNaN

    • 用于判断是否不是一个数字。不是数字返回true,是数字返回false。
    • NaN与任何值都不相等,包括他自己本身

1.9 String 类型(一)

  • 在开发中我们经常会有一些文本需要表示,这个时候我们会使用字符串String:

    • 比如人的姓名:xxx。地址:广州市。简介:认真是一种可怕的力量;
  • JavaScript 中的字符串必须被括在引号里,有三种包含字符串的方式。

    • 双引号:“Hello”
    • 单引号:'Hello’
    • 反引号:`Hello`(ES6之后学习)
  • 前后的引号类型必须一致:

    • 如果在字符串里面本身包括单引号,可以使用双引号;
    • 如果在字符串里面本身包括双引号,可以使用单引号;

1.10 字符串中的转义字符

  • 除了普通的可打印字符以外,一些有特殊功能的字符可以通过转义字符的形式放入字符串中:
  • 转义字符串开发中只有特殊场景才会用到,暂时掌握 \’\” \t \n四个的用法即可。

1.11 字符串的属性和方法

  • 字符串还有很多细节和操作方法,在后续学习了面向对象后,我们再详细学习;

  • 这里我们先掌握几个基本的字符串使用操作:

  • 操作一:字符串拼接,通过+运算符(后续还会详细讲解)

  • 操作二:获取字符串长度

1.12 Boolean类型

  • Boolean(布尔)类型用于表示真假:

    • 比如是否毕业. 是否有身份证. 是否购买车票. 是否成年人;
    • 比如开发中,我们会判断一个账号是否登录、是否是管理员、是否具备某个权限、是否拥有某个英雄、皮肤等;
  • 布尔(英语:Boolean)是计算机科学中的逻辑数据类型,以发明布尔代数的数学家乔治·布尔为名。
  • Boolean 类型仅包含两个值:true 和 false

1.13 Undefined类型

  • Undefined 类型只有一个值,就是特殊值 undefined。

    • 如果我们声明一个变量,但是没有对其进行初始化时,它默认就undefined;
  • 下面的代码是一样的

  • 这里有两个注意事项:

    • 注意一:最好在变量定义的时候进行初始化,而不只是声明一个变量;
    • 注意二:不要显示的将一个变量赋值为undefined
      • ✓ 如果变量刚开始什么都没有,我们可以初始化为0、空字符串、null等值;

1.14 Object类型

  • Object 类型是一个特殊的类型,我们通常把它称为引用类型或者复杂类型;

    • 其他的数据类型我们通常称之为 “原始类型”,因为它们的值质保函一个单独的内容(字符串、数字或者其他);
    • Object往往可以表示一组数据,是其他数据的一个集合;
    • 在JavaScript中我们可以使用 花括号{} 的方式来表示一个对象;
      *

1.15 Null类型

  • Null 类型同样只有一个值,即特殊值 null。

    • null类型通常用来表示一个对象为空,所以通常我们在给一个对象进行初始化时,会赋值为null;
    • null 存在的意义就是对对象进行初始化,此时堆中指向0x00区别{}
  • null和undefined的关系:

    • undefined通常只有在一个变量声明但是未初始化时,它的默认值是undefined才会用到;
    • 并且我们不推荐直接给一个变量赋值为undefined,所以很少主动来使用;
    • null值非常常用,当一个变量准备保存一个对象,但是这个对象不确定时,我们可以先赋值为null

1.16 数据类型总结

  • JavaScript 中有八种基本的数据类型(前七种为基本数据类型,也称为原始类型,而 object 为复杂数据类型,也称为引用类
    型)。

    • number 用于任何类型的数字:整数或浮点数。
    • string 用于字符串:一个字符串可以包含 0 个或多个字符,所以没有单独的单字符类型。
    • boolean 用于 true 和 false。
    • undefined 用于未定义的值 —— 只有一个 undefined 值的独立类型。
    • object 用于更复杂的数据结构。
    • null 用于未知的值 —— 只有一个 null 值的独立类型。

    1.17 数据类型的转换

  • 在开发中,我们可能会在不同的数据类型之间进行某些操作

    • 比如把一个String类型的数字和另外一个Number类型的数字进行运算;
    • 比如把一个String类型的文本和另外一个Number类型的数字进行相加;
    • 比如把一个String类型或者Number类型的内容,当做一个Boolean类型来进行判断;
    • 等等
  • 也就是在开发中,我们会经常需要对数据类型进行转换:

    • 大多数情况下,运算符和函数会自动将赋予它们的值转换为正确的类型,这是一种隐式转换;
    • 我们也可以,通过显示的方式来对数据类型进行转换;

1.18 字符串String的转换

  • 其他类型经常需要转换成字符串类型,比如和字符串拼接在一起或者使用字符串中的方法。
  • 转换方式一:隐式转换
    • 一个字符串和另一个字符串进行+操作;如果+运算符左右两边有一个是字符串,那么另一边会自动转换成字符串类型进行拼接;
    • 某些函数的执行也会自动将参数转为字符串类型;比如console.log函数;
  • 转换方式二:显式转换
    • 调用String()函数 有些值没有toString(),这个时候可以使用String()。比如:undefined和null;
    • 调用toString()方法(后续面向对象再学习);
  • 方法和函数的区别,我们后续在讲解面向对象时会讲到;

1.19 数字类型Number的转换

  • 其他类型也可能会转成数字类型。
  • 转换方式一:隐式转换
    • 在算数运算中,通常会将其他类型转换成数字类型来进行运算; 比如 “6” / “2”; 但是如果是+运算,并且其中一边有字符串,那么还是按照字符串来连接的;
  • 转换方式二:显式转换
    • 我们也可以使用Number()函数来进行显式的转换;
  • 其他类型转换数字的规则:
    *

1.20 布尔类型Boolean的转换

  • 布尔(boolean)类型转换是最简单的。

  • 它发生在逻辑运算中,但是也可以通过调用 Boolean(value) 显式地进行转换。

  • 转换规则如下:

    • 直观上为“空”的值(如 0、空字符串、null、undefined 和 NaN)将变为 false。
    • 其他值变成 true。
  • 注意:包含 0 的字符串 “0” 是 true

    • 一些编程语言(比如 PHP)视 “0” 为 false。但在 JavaScript 中,非空的字符串总是 true。

JavaScript基础之三JavaScript变量和数据类型相关推荐

  1. Java基础篇1——变量与数据类型

    Java基础篇1--变量与数据类型 1.标识符命名规则 标识符以由大小写字母.数字.下划线(_)和美元符号($)组成,但是不能以数字开头. 大小写敏感 不能与Java语言的关键字重名 不能和Java类 ...

  2. JavaScript(一)——变量,数据类型及转换、运算符和逻辑结构

    JS 1.概述 2.开发环境 3.JS的语法规范 4.变量与常量 4.1常量 4.2 变量 5.数据类型 **typeof 检测数据类型** 5.1原始类型 (1)数值型 (2)字符串型 (3)布尔型 ...

  3. javascript百炼成仙 第一章 掌握JavaScript基础1.3变量的声明

    叶小凡收起心神,继续阅读"JavaScript基础修炼要诀",忽然,他眼前一亮. "原来如此,直接量虽然只是昙花一现,但是如果我能用var定义一个变量,再指向那个直接量, ...

  4. Web前端开发精品课HTML CSS JavaScript基础教程JavaScript部分知识点总结

    内容来自莫振杰Web前端开发精品课HTML CSS JavaScript基础教程章节总结 第24章  JavaScript简介 1.HTML是网页的结构,CSS是网页的外观,而JavaScript是网 ...

  5. day02--java基础编程:变量,数据类型,类型转换,运算规则,运算符,分支结构,循环(随机数),方法,重载,可变参数,递归,数组,冒泡排序

    1 Day02–变量+数据类型+类型转换 1.1 前言 1.1.1 标识符 可以简单的理解为一个名字.在Java中,我们需要标识代码的很多元素,包括包名.类名.方法.字段.变量等.我们选择的名称就称为 ...

  6. day02--java基础编程:变量,数据类型,类型转换,运算规则,Scanner,运算符,分支结构,循环(随机数),方法,重载,可变参数,递归,数组,冒泡排序

    1 Day02–变量+数据类型+类型转换 1.1 前言 1.1.1 标识符 可以简单的理解为一个名字.在Java中,我们需要标识代码的很多元素,包括包名.类名.方法.字段.变量等.我们选择的名称就称为 ...

  7. JavaScript基础之一JavaScript的邂逅

    1.JavaScript的邂逅 1.0 前端的三大核心 前端开发最主要需要掌握的是三个知识点:HTML.CSS.JavaScript 1.1 计算机语言 前面我们已经学习了HTML和CSS很多相关的知 ...

  8. 【Java基础】--第1~6章:基础知识、变量和数据类型、运算符、程序控制结构、数组

    文章目录 Java基础 一.Java概述 Java技术体系平台 Java重要特点 Java运行机制及运行过程 Java核心机制--Java虚拟机(JVM) 编译和运行过程 JDK和JRE 二.基础知识 ...

  9. Java基础:(2)变量及数据类型

    1.变量:存数的 1)声明:----相当于在银行开了个帐户 int a; //声明一个整型的变量,名为a int b,c,d; //声明三个整型的变量,名为b,c,d 2)初始化:----相当于给帐户 ...

最新文章

  1. 查看Firefox中的缓存
  2. ECharts简单的运行示列(固定数据和交互数据库)
  3. 使用 $.grep() 方法
  4. PHP将英文数字转换为阿拉伯数字 
  5. ashx误删后,未能创建类型
  6. 湖湘杯 | Misc Wp
  7. C 语言中double类型数据占字节数为,C 语言中 double 类型数据占字节数为_____
  8. 使用ABAP(ADBC)和Java(JDBC)连接SAP HANA数据库 1
  9. 【渝粤题库】国家开放大学2021春2786初级西方经济学题目
  10. Manasa and Combinatorics
  11. c语言因为是汇编语言的一种,. C语言是一种(). A.机器语言B.汇编语言C.中级语言D.高...
  12. iMovie for Mac如何创建分屏效果?
  13. window.crypto.subtle进行rsa-oaep加密
  14. 面经自己汇总(三维视觉算法机器学习深度学习)——持续更新
  15. HDU 5294 Tricks Device(多校2015 最大流+最短路)
  16. 强烈推荐,一步一步学装电脑(有图)
  17. android gps磁偏角,GPS数据格式解析
  18. 连续三次世界500强面试经历
  19. C#的兰姆达表达式与委托配合使用时的一些问题
  20. windows7系统损坏修复_重装系统是选择 ghost win7 还是原版 win7_windows7教程

热门文章

  1. 计算机毕业设计(附源码)python疫苗注射动态数据可视化系统
  2. CTO是什么样的职位?
  3. UTC时间转北京时间JAVA方法
  4. python画笛卡尔心形线方程_伊对:学霸如何谈恋爱?揭秘不同专业的学霸表白方式...
  5. opencv: dataType
  6. Oracle数据库所有知识点集合
  7. python dfs算法_LeetCode | 一文帮你搞定BFS、DFS算法(python版)
  8. html5 黑色圆圈,html5 css3圆形百分比加载动画特效
  9. 边缘计算服务器传感器无线组网,边缘计算扩展IoT网络三种方法
  10. [Toddler's Bottle]-collision