VSCode插件和配置

image.png
输入clg即可输入console.log()

在setting.json添加

1
2
3
// 大括号连线设置
  "editor.bracketPairColorization.enabled": true,
  "editor.guides.bracketPairs": "active"

选中大括号，可以查看范围

变量的命名格式

  • 在JavaScript中如何命名一个变量呢？包含两部分：
    • 变量的声明：在JavaScript中声明一个变量使用var关键字（后续学习ES6还有let、const声明方式）
    • 变量的赋值：使用 = 给变量进行赋值；
    • image.png
  • 这个过程也可以分开操作：
  • image.png
  • 同时声明多个变量：
  • image.png

变量的命名规范

  • 变量命名规则：必须遵守
    • 1.第一个字符必须是一个字母、下划线（ _ ）或一个美元符号（ $ ）
    • 2.其他字符可以是字母、下划线、美元符号或数字
    • 3.不能使用关键字和保留字命名：
    • 4.变量严格区分大小写
  • 变量命名规范：建议遵守
    • 多个单词使用驼峰标识；
    • 赋值 = 两边都加上一个空格；
    • 一条语句结束后加上分号; 也有很多人的习惯是不加；
    • 变量应该做到见名知意；

变量的使用注意

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

JavaScript的数据类型

  • 在 JavaScript 中有 8 种基本的数据类型（7 种原始类型和 1 种复杂类型）
    • Number
    • String
    • Boolean
    • Undefined
    • Null
    • Object
    • BigInt（后续了解）
    • Symbol（后续了解）

typeof操作符

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

Number类型

  • number 类型代表整数和浮点数。
    • image.png
  • 数字number可以有很多操作，比如，乘法 *、除法 /、加法 +、减法 - 等等。
  • 除了常规的数字，还包括所谓的“特殊数值”也属于Number类型（了解）
    • Infinity：代表数学概念中的 无穷大 ∞，也可以表示-Infinity；
      • 比如 1/0 得到的就是无穷大；
    • NaN：NaN 代表一个计算错误，它是一个错误的操作所得到的结果；
      • 比如 字符串和一个数字相乘；
  • 数字表示的范围：
    • 最小正数值：Number.MIN_VALUE，这个值为： 5e-324，小于这个的数字会被转化为0
    • 最大正数值：Number.MAX_VALUE，这个值为： 1.7976931348623157e+308
  • isNaN
    • 用于判断是否不是一个数字。不是数字返回true，是数字返回false。

String类型

  • JavaScript 中的字符串必须被括在引号里，有三种包含字符串的方式。
    • 双引号：”Hello”
    • 单引号：’Hello’
    • 反引号：Hello（ES6之后学习）
  • 前后的引号类型必须一致：
    • 如果在字符串里面本身包括单引号，可以使用双引号；
    • 如果在字符串里面本身包括双引号，可以使用单引号；
  • 除了普通的可打印字符以外，一些有特殊功能的字符可以通过转义字符的形式放入字符串中：
    • image.png
  • 转义字符串开发中只有特殊场景才会用到，暂时掌握 \’\” \t \n四个的用法即可。
  • 操作一：字符串拼接，通过+运算符 image.png
  • 操作二：获取字符串长度 image.png

Undefined类型

  • Undefined 类型只有一个值，就是特殊值 undefined。
    • 如果我们声明一个变量，但是没有对其进行初始化时，它默认就是undefinedimage.png
  • 下面的代码是一样的image.png
  • 这里有两个注意事项：
    • 注意一：最好在变量定义的时候进行初始化，而不只是声明一个变量；
    • 注意二：不要显示的将一个变量赋值为undefined
      • 如果变量刚开始什么都没有，我们可以初始化为0、空字符串、null等值；

Null类型

  • Null 类型同样只有一个值，即特殊值 null。
    • null类型通常用来表示一个对象为空，所以通常我们在给一个对象进行初始化时，会赋值为null；image.png
  • null和undefined的关系
    • undefined通常只有在一个变量声明但是未初始化时，它的默认值是undefined才会用到；
    • 并且我们不推荐直接给一个变量赋值为undefined，所以很少主动来使用；
    • null值非常常用，当一个变量准备保存一个对象，但是这个对象不确定时，我们可以先赋值为null；

字符串String的转换

  • 其他类型经常需要转换成字符串类型，比如和字符串拼接在一起或者使用字符串中的方法。
  • 转换方式一：隐式转换
    • 一个字符串和另一个字符串进行+操作；
      • 如果+运算符左右两边有一个是字符串，那么另一边会自动转换成字符串类型进行拼接；
    • 某些函数的执行也会自动将参数转为字符串类型；
      • 比如console.log函数；
  • 转换方式二：显式转换
    • 调用String()函数；
    • 调用toString()方法（后续面向对象再学习）；

数字类型Number的转换

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

布尔类型Boolean的转换

  • 布尔（boolean）类型转换是最简单的。
  • 它发生在逻辑运算中，但是也可以通过调用** Boolean(value) **显式地进行转换。
  • 转换规则如下：
    • 直观上为“空”的值（如 0、空字符串、null、undefined 和 NaN）将变为 false。
    • 其他值变成 true。 image.png
  • 注意：包含 0 的字符串 “0” 是 true
    • 在 JavaScript 中，非空的字符串总是 true。