02_JavaScript变量名和常见数据结构

变量名格式

• js中命名一个变量包含两部分

  • 变量的声明: 在js中声明一个变量使用var关键字(variable)

  • 变量的赋值: 使用 = 给变量进行赋值

  • //写法一:声明的同时赋值
    var name = "kaisa"
    //写法二:先声明再赋值
    var name
    name = "kaisa"
    

js变量的命名规则

• 变量命名规则(必须遵守)

  • 第一个字符必须是一个字母、下划线或一个美元符号
  • 其他字符可以是 字母、下划线、数字、美元符号
  • 不能使用关键字和保留字

• 变量命名规范(建议遵守)

  • 多个单词之间使用驼峰标识

  • 赋值符号 “=” 前后各加一个空格

  • 变量名应该做到见名之意

变量的注意事项

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

js的数据类型

• 动态类型介绍

  • 我们可以将值赋值给一个变量，那么这个变量就具备了特定的类型
  • 在js中一个变量可以在前一刻是个字符串，下一刻就储存一个数字
  • 允许这种操作的语言（例如js）被称为 动态类型的编程语言

• 在js中有8种基本的数据类型（7种原始类型和1种复杂类型）

  • Number
  • String
  • Boolean
  • Undefined
  • Null
  • Object
  • Bigint（ES8）
  • Symbol（ES6）

typeof操作符

• 因为ECMAScript的类型系统是 松散的，所以需要一种手段来确定任意变量的数据类型。typeof操作符就是为此产生的

• var info = "why"
  console.log( typeof info )
  

• typeof()的用法:

  • typeof(x) 它与 typeof x 相同

  • typeof是一个 操作符,并非是一个函数,()只是将后续内容当做一个整体而已

  • console.log(typeof(info))
    

数据类型

Number类型

• number类型代表整数和浮点数

  • var age = 18
    var height = 1.88
    

• 数字number可以有很多操作, 比如 加减乘除等等

  • var result1 = 10 * 2
    var result1 = 10 / 3
    

• 除了常规数字还有一些 特殊值也属于Number类型(了解)

  • Infinitiy: 代表无穷的值 也可以表示 -Infinitiy
    • 比如 1/0 的到的就是无穷大
  • NaN: 表示一个 计算错误, 他是一个 错误的操作所得到的结果
    • 比如 一个字符串和一个数字相乘

• 进制的表示

  • var num1 = 100 //十进制100
    //了解
    var num2 = ox100 //十六进制100
    var num3 = 0o100 // 八进制100
    var num4 = 0b100 // 二进制100
    

• 数字可以表示的范围

  • var max = Number.MAX_VALUE //最大值
    var min = Number.MIN_VALUE //最小值
    console.log(max, min)
    

• isNaN

  • 用于判断是否不是一个数字, 如果不是数字返回true, 是数字返回false

String类型

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

  • 比如: 人的姓名、地址、简介

  • var name = "kaisa"
    var address = "成都市"
    var info = "认真是一种可怕的力量"
    

• js中 字符串必须被括在引号里面 有三种包含字符串的方式

  • //单引号
    var name1 = 'kaisa'
    //双引号
    var name2 = "kaisa"
    //反引号(ES6新增) 
    var name3 = `kaisa`
    //反引号可以拼接变量
    var name4 = `Hello , ${name2}`
    

• 字符串的属性和方法

  • 暂时掌握两个基本的字符串使用操作

  • 操作一: 字符串拼接, 通过 + 运算符

    • var str1 = "Hello"
      var str2 = "World"
      var newstr = str1 + str2
      console.log(newstr) // Hello World
      

  • 操作二: 通过反引号拼接(ES6 推荐)

    • var str1 = "Hello"
      var str2 = `${str1} world`
      console.log(str2) // Hello World
      

  • 操作三: 获取字符串的长度

    • var str = "Hello World"
      console.log(str.length) //打印字符串的长度 11
      

Boolean类型

• Boolean（布尔）类型用于表示真假
  • 比如：是否毕业. 是否有身份证. 是否购买车票. 是否成年人；
  • 比如：开发中，我们会判断一个账号是否登录、是否是管理员、是否具备某个权限、是否拥有某个英雄、皮肤等
• Boolean 类型仅包含两个值：true 和 false

Undefined类型

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

• 如果我们声明一个变量，但是没有对其进行初始化时，它默认就是undefined

• var age
  console.log(age) //undefined
  

• 注意事项

  • 注意一: 最好在变量定义的时候进行初始化，而不只是声明一个变量
  • 注意二: 不要将一个变量赋值为undefined

Object类型

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

  • 其他的数据类型我们通常称之为 “原始类型”，因为它们的值, 只包含一个单独的内容（字符串、数字或者其他）

  • Object往往可以表示一组数据，是其他数据的一个集合

  • 在JavaScript中我们可以使用 花括号{} 的方式来表示一个对象

  • var info = {
      name = "kaisa",
      age = 18,
      height = 1.88
    }
    

• Object是对象的意思，后续我们会详细学习, 面向对象的概念等

Null类型

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

  • null类型通常用来表示一个对象为空，所以通常我们在给一个对象进行初始化时, 暂时还没想好赋值给什么，此时可以赋值为null

  • 给对象进行初始化时 建议初始化为Null 不建议初始化为{}

  • var obj = Null //初始化
    

• null和undefined的关系

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

数据类型转换

• 在开发中，我们可能会在不同的数据类型之间进行某些操作
  • 比如把一个String类型的数字和另外一个Number类型的数字进行运算
  • 比如把一个String类型的文本和另外一个Number类型的数字进行相加
  • 比如把一个String类型或者Number类型的内容，当做一个Boolean类型来进行判断
  • 等等
• 也就是在开发中，我们会经常需要对数据类型进行转换
  • 大多数情况下，运算符和函数会自动将赋予它们的值转换为正确的类型，这是一种隐式转换
  • 我们也可以，通过显示的方式来对数据类型进行转换

其他类型转换String类型

• 转换方式一: 隐式转换

  • 一个字符串和其他类型进行 + 操作

    • 如果 + 运算符左右两边有一个是字符串, 那么另一边会自动转换成字符串类型进行拼接

    • var num = 123
      var isAdmin = true
      var numStr = num + ""
      var isAdminStr = isAdmin + '' 
      console.log(typeof numStr, typeof isAdminStr) //此时numStr和isAdminStr 是string类型的123和true
      

  • 某些函数的执行也会自动将参数转为字符串类型

    • 比如: console.log函数

• 转换方式二: 显示转换

  • 通过调用String函数

    • var num = 123
      var numStr = String(num)
      consloe.log(typeof numStr)
      

  • 通过调用toString()方法, 暂时了解后续学习

其他类型转换Number类型

• 转换方式一: 隐式转换 (用的少)

  • 在算数运算中，通常会将其他类型转换成数字类型来进行运算；

    • var str1 = "4"
      var str2 = "3"
      var reslut = str1 * str2
      console.log(typeof result) //此时result为数字类型的32
      

  • 但是如果是+运算，并且其中一边有字符串，那么还是按照字符串来连接的

    • var str1 = "4"
      var str2 = "3"
      var reslut = str1 + str2
      console.log(typeof result) //此时result为字符串类型的43
      

• 转换方式二: 显示转换

  • 我们也可以使用Number()函数来进行显式的转换

    • var str1 = "4"
      var reslut = Number(str1)
      console.log(typeof result) //此时result为数字类型的4
      

  • 其他类型转换为数字类型的规则

    • console.log(Number(undefined)) //undefined转为数字类型结果是 NaN
      console.log(Number(true)) //ture转为数字类型结果是 1
      console.log(Number(false)) //fales转为数字类型结果是 0
      console.log(Number(null)) //null转为数字类型结果是 0
      console.log(Number("abc123")) //字符串中若包含非数字的其他字符 转为数字类型结果是 NaN
      console.log(Number("")) //空字符串转为数字类型结果是 0
      

其他类型转换Boolean类型

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

• 转换规则如下

• 直观上为“空”的值（如 0、空字符串、null、undefined 和 NaN）将变为 false

• 其他值变成 true

• 注意事项：包含 0 的字符串 “0” 是 true

  • console.log(Boolean("")) //转换后为false
    console.log(Boolean("0")) //转换后为true