js基础重读红宝书(一)

这是我参与8月更文挑战的第12天,活动详情查看:8月更文挑战

1. 了解javascript

  • JavaScript是一门松散的面向对象语言

  • 现在意义上JavaScript由三个ECMAScript(核心)+ 文档对象模型(BOM)+浏览器对象模型(DOM)这三部分组成。

  • 我们通常接触的JavaScript是运行在web浏览器上面的。而web浏览器与ECMAScript没有依赖关系。web浏览器基于ECMAScript构建了更完善的脚本(如添加了bom和dom)。

    • 类似的宿主环境还有node
  • ECAMScript 规定了哪些内容

    • 语法
    • 类型
    • 语句
    • 关键字
    • 保留字
    • 操作符
    • 对象

    总结: 提供了核心语言功能

  • 文档对象模型DOM

    • 文档对象模型是应用于对html结构进行操纵的API接口

    • DOM操作html的基础,是浏览器把网页渲染成一颗dom树,DOM把整个页面映射为一个多层级的结构。

    • 我们借助dom提供的api去操作的这个多层级的结构。很轻松的对dom元素进行增删改查。

    • DOM的主要功能:

      1. 映射html结构
      2. DOM视图(DOM Views):定义了跟踪不同文档(例如 应用css 之前和之后的文档) 视图的接口
      3. DOM事件(DOM Events): 定义了事件和事件处理的接口
      4. DOM样式(DOM Style): 定义了基于css为元素应用样式的接口
      5. DOM遍历和范围(DOM Traversal and Range): 定义了遍历和操作文档树的接口
    • 总结: 提供了访问与操作网页内容的方法和接口

  • 浏览器对象模型 BOM

    • 浏览器对象模型是应用于对浏览器窗口进行操作的api
      • 可以操作除了浏览器显示的页面以外的部分
      • BOM只处理浏览器窗口和框架
      • 具体的扩展有:
        • 弹出新浏览器窗口的功能
        • 移动、缩放和关闭浏览器窗口的功能
        • 提供浏览器详细信息的navigator
        • 提供浏览器页面所加载页面的详细信息的location对象
        • 提供用户显示器分辨率详细信息的screen对象
        • 对cookies的支持
        • 像XMLHttpRequest 和 IE的 ActiveXObject这样的自定义对象
    • 总结: 提供了与浏览器交互的方法和接口

2. 在html中使用JavaScript

2.1 script元素

解释器的执行顺序是从上到下执行,从开始进行顺序执行。没有执行完毕的话,则下面的代码或元素不允许执行或展现。不管是嵌入的js还是外部引用的js还是html元素。

外部引入的js文件可以被浏览器进行缓存

  • script元素常用的属性:

    1. async: 可选
      • 表示应立即下载脚本,但是不应妨碍页面中的其他的操作。只对外部资源有效
    2. defer: 可选
      • 表示脚本会被延迟到文档完全被解析和显示之后执行。只对外部资源有效。
    3. src: 可选
      • 表示外部文件的路径
    4. type: 必选,默认为’text/javascript’
      • 表示编写代码使用的脚本语言的内容类型(也被称为MIME类型)
      • 在实际上服务器传送js文件时使用MIME类型通常是 application/x-javascript 或 application/javascript
  • 关于defer – 延迟脚本

    • 通知浏览器立即下载(与同步外部js一样立即下载,但是延迟执行)。defer脚本会等到html解析器解析完毕进行执行。defer脚本执行完之后会立即执行DOMContentLoaded事件。
    • 把defer脚本去掉defer放在页面底部是最佳的选择。
  • 关于async — 异步脚本

    • 通知浏览器立即下载文件,但是继续向下执行,等到该文件被下载完毕html解析器则去执行该文件
      • 这里有两种情况
        1. html解析器已经把dom树解析完毕了
          1. 如果解析完毕则会触发DOMContentLoaded事件。然后再去执行async 脚本
        2. html解析器未被dom树解析完毕
          1. 如果未解析完毕,则会暂停解析,去执行async脚本。
      • 所以async 脚本一定会在页面的load事件前执行,但可能会在DOMContentLoader之前或之后执行。
      • async的目的 就是不让页面等待脚本的下载和执行,所以最好不要再async脚本中去操作dom元素。
  • 一些小注意点

    带有src属性的

2.2 noscript元素

  • noscript元素解决的问题就是:

    1. 浏览器不支持脚本
    2. 浏览器支持脚本,但浏览器禁用了。
    // 如果出现上述两种情况则以下html会同时展示在页面中 
    <noscript>
       <p>你的网站不支持JavaScript</p>
    </noscript>
    <h1>哈哈哈哈</h1>
    // 在单页面应用程序中较为实用
    复制代码
  • 禁用js时可以保证基本功能,比如结构和样式,在设计的时候 保持优雅降级和渐进增强的原则进行网站开发。

3. ecmascript基础语法

3.1 基本概念

描述一门语言最基本的工作原理都要涉及到这么语言的语法、操作符、数据类型、内置功能等用于构建复杂解决方案的基本概念

3.2 语法

  • 区分大小写
    • ecmascript中一切(变量、函数名、操作符)都区分大小写
  • 标识符
    • 指 –> 变量、函数、属性的名字或者函数的参数
    • 命名规则一: 第一个字符必须是一个字母、下划线或者一个美元符号
    • 命名规则二:其他字符可以是字母、下划线、美元符号或者数字
    • 命名惯例: ecmascript标识符采用驼峰大小写格式。
    • 不能把关键字、保留字作为标识符
  • 注释:
    • 单行注释
    • 多行注释
  • 严格模式
    • ecmascript引入了严格模式的概念。严格模式是为了JavaScript定义了一种不同的解析和执行模型
    • 严格模式可以在对整个脚本启用严格模式,也可以在函数体内部第一行为这个函数作用域内的代码开启严格模式
    • “use strict” 是一个编译指令, 用于告诉JavaScript引擎切换到严格模式。
  • 关键字和保留字
    • 这里需要注意一下的是:在严格模式下,eval 和 arguments不能作为标识符和属性名

3.3 数据类型

3.3.1 基本概念

ecmascript中有5种简单(基本)数据类型: Undefined、Null、Boolean、Number和String。

复杂数据类型:Object。

3.3.2 检测变量的数据类型 — typeof操作符

  • “undefined” ———这个值未定义
  • “boolean” ——— 这个值是布尔值
  • “string” ——— 这个值是字符串
  • “number” ——— 这个值是数值
  • “object” ——— 这个值是对象或者null 或者是正则
  • “function” ——— 这个值是函数

如果我们见到typeof (msg) 这样的写法,两边的括号去掉也是可以的。

(特殊的情况)对正则进行typeof的话, 在safari 5- chrom7- 对正则使用typeof返回的是function

3.3.3 undefined类型

  • 未被定义

  • 变量声明之后,未被赋值则自动赋值undefined。

3.3.4 null

  • 空指针对象

3.3.5 boolean

  • boolean值只有两个 true 或者false
  • 如果要将一个值转换为Boolean值,则可以调用转型函数Boolean()
  • Boolean()转型函数规则
数据类型 结果为true 结果为false
boolean true false
string 任何非空字符串 “” (空串)
number 任何非零数字值(包括无穷大) 0和NaN
object 任何对象 null
undefined undefined

3.3.6 number类型

  • number类型表示整数和浮点数类型
  1. 数值字面量有十进制和八进制和十六进制
  • 其中八进制字面值的第一位必须是0,然后后面数字的范围是0-7。–否则会按照十进制进行解析
    • 例如 var num = 070 // 八进制的56
    • 例如 var num = 079 // 无效的八进制 解析为79
    • 八进制字面量在严格模式下无效
  • 其中十六进制字面量前两位必须是0x,后跟 ( 0~9 与 A(a)~F(f) )。 –否则会报错。
  1. 浮点数值

    • 所谓浮点数,就是该数值中必须包含一个小数点,而且这个小数点后面必须至少有一位数字。0.xxx其中0可以省略。

    • 如果小数点后面没有整数,全都是0的话,则会解析为整数。

    • 浮点数值的空间所占的是整数值的空间的两倍,ecmascript会巧妙将后面为0的浮点数转换为整数。

  2. 数值的范围

    • Number.MAX_VALUE 与 Number.MIN_VALUE分别代表js数值范围的最大值和最小值
    • 确定一个数是否在最小数和最大数之间, 可以使用isFinite( xxx ) 函数确定是不是在范围之间
    • 如果这个数在范围之外,则为Infinity 或 -Infinity
  3. NaN

    • 一个特殊的数值(Not a Number), 用于返回一个本来要返回数值的操作数但是未返回数值的情况。
    • 任何涉及到NaN的操作都是NaN
    • ecmascript中定义了isNaN函数, 用来一个数据是不是NaN

isFinite() 和 isNaN() 和 对数值进行 – * / 操作都会先试图将参数/运算的数据 转换为数值。如果转化成功,按照数值的方式进行计算,转换不了,就直接返回NaN。

如果是对象的话, 则会先调用对象的valueOf() 方法, 如果返回数值,照常计算,如果不是则调用toString()方法,如果不是则返回NaN。

  1. 数值转换的方法

    • 上述所说的数值转换的方法除了调用valueOf方法和toString方法以外,进行数值转换都会隐式的调用

    Number()方法进行数值转化

    1. Number() 适用于上述说的对象

      • number方法的转换规则

        1. 数值类型 返回的结果
          boolean true/1 false/0
          number 简单的传入和返回
          null 0
          undefined NaN
          字符串 1. 如果只包含数字, 则只会将其转换为10进制(八进制会自动去0)
          2. 如果只包含浮点格式的数字,则会将其转换为对应的浮点数值
          3. 如果只包含有效十六进制格式的,则将其转换为相同大小的十进制整数
          4. 如果字符串是空串, 则转换为0
          5. 除了上述,其他的全部是NaN

      | 对象 | 调用其valueOf方法进行转换,如果没有valueOf方法,调用toString方法进行转化,如果valueOf方法或者toString方法都不是,则返回NaN |

  2. parseInt() 不适用于对象,只适用于字符串和数字

    • 会找到传递进来的参数的第一个非空格的字符。
      1. 如果该字符不是数字直接返回NaN
      2. 如果该字符串是数字则继续找直到找到最后或者不是数字的字符停止。然后返回。
    • 与Number转换字符串的区别
      • 不适用于对象,只适用于字符串和数字
      • Number对空串返回0 ,parsetInt返回NaN
      • paserInt可以识别八进制, es5以后已经不识别了
      • parseInt第二个参数可以传递一个数字作为进制。
        • 就会将指定的参数作为指定的进制进行解析。
        • parsetInt(‘AF’, 16) / 175
    - parsetInt('0xAF', 16)   / 175
    复制代码
  3. parseFloat() 不适用于对象,只适用于字符串和数字

    • 与parseInt相同,但是parseFloat没有第二个参数,只能把数据当作十进制进行识别。
      • 例如parseFloat(‘0xaf’) 返回的结果为 0
    • parseFloat解析字符串的过程中,遇到的第一个小数点是有效的,第二个就是无效的了。
    • 如果parseFloat解析的字符串没有小数点,则parseFloat会返回整数。

3.3.7 string类型

  • 如果 string类型包含一些特殊的字面量,则需要进行转义

  • 字符串是不可变的,字符串一旦创建,他们的值就不能改变。改变值只是销毁了原来的字符串,创建了一个新的字符串。

  • 转换为字符串。除了null 和 undefined没有toString()方法,其他的都有toString()方法。关于toString()方法可以传递一个参数,可以返回一个数值的转换为x进制, 然后展示其结果的字符串表现形式。

  • 如果不知道要转换的值是不是null或undefined, 可以利用转型函数String(xxx) ,这个函数能够将任何类型的值转换为字符串。这个函数也是利用了toString方法,不过如果值是null或者undefined返回字面量罢了。

  • 使用字面量的方式和创建对象的方式声明一个字符串的异同

  1. 使用字面量声明的字符串是放在常量池中的。
  2. 当调用方法的时候,临时创建了一个new String(str) 然后去执行方法,执行完将String对象进行销毁。
  3. 常量池中的数据无法添加属性和行为。也不属于Object。就是一个常量。所以它具备不可变性。
  4. 使用new String创建的字符串是放在堆内存中。
    1. 具备一个对象的所有行为。

3.3.8 object类型

  • ecmascript中的对象其实就是一组数据和功能的集合。无序的键值对, Object类型是所有它的实例的基础。

换句话说,object类型所具有的任何属性和方法也同样存在于更具体的对象。换句话说, 他们是无尽的递归。

  • object 的每个实例都具有下列属性和方法
    • constructor : 保存着用于创建当前对象的函数
    • hasOwnProperty(propertyName: string): 用于检查给定的属性是否在当前创建的实例中,而不是在原型上。
    • isPrototypeOf(object): 用于检查传入的对象是否是当前对象的原型 (????????????)
    • propertyIsEnumerable(propertyName: string): 用于检查给定的属性是否能够被当前对象使用for-in语句进行枚举。
    • toString() 返回该对象的字符串表现形式
    • valueOf() 每个核心对象都会覆盖此方法返回一个适当的值。如果没有覆盖,则返回该对象本身。
      • valueOf 方法类似于接口的形式可以让自定义对象自定义实现。

3.4 操作符

JavaScript有一系列操作数据值的操作符,包括算术运算符(加号和减号运算符)、位操作符、关系操作符和相等操作符。 因为js的特性,操作符会进行着分情况讨论而进行一些转型操作。而复杂类型的操作符会调用对象的valueOf() 或 toString()方法。

3.4.1 一元操作符

  1. 递增和递减

  2. 一元加 与 一元减

  3. 位操作符、按位非、按位与、按位或、按位异或等 涉及到计算机组成课程的知识,就不说了。

  4. 布尔操作符

  5. 逻辑与 与 逻辑或

3.4.2 其他运算符

  1. 乘法操作符

    • 如果都是数值进行常规运算

    • 如果有操作数不是数值, 则将不是操作数的数值 隐式调用Number() 将其转换为数值,然后再进行计算。

  2. 除法运算符

    • 如果都是数值进行常规运算

    • Infinity / Infinity 返回NaN

    • 0 / 0 返回NaN

    • 如果非零的有限数除以零,则结果是Infinity 或 -Infinity,取决于有符号操作数的符号。

    • 如果有操作数不是数值, 则将不是操作数的数值 隐式调用Number() 将其转换为数值,然后再进行计算

  3. 取模运算符

    • 除数是0返回NaN

    • 如果有操作数不是数值, 则将不是操作数的数值 隐式调用Number() 将其转换为数值,然后再进行计算.

  4. 加法运算符

    • 如果有一个数是字符串,则将第二个操作符与第一个操作符连接起来。。
      • 如果都是字符串直接相加
      • 如果有一个不是字符串,则调用该对象的toString()方法取得相应的字符串。如果是undefined和null 则返回字面量。
  5. 减法运算符

    • 如果有操作数是字符串、布尔值、null和undefined, 则现在后台调用Number函数将其转为数值。在继续计算,(如果出现了NaN,则结果就是NaN)
    • 如果有一个操作数是对象,则调用对象的valueOf方法以取得该对象的数值,如果得到的值是NaN,则结果就是NaN,如果没有valueOf方法就调用toString方法。

3.4.3 关系操作符

大于、小于、小于等于、大于等于这几个关系操作符用于对两个值进行比较。

比较规则
如果两个操作数都是数值,则执行数值比较
如果两个操作数都是字符串,则比较两个字符串对应的字符编码值
如果一个操作数是数值,则将另一个操作数转换为数值,然后执行数值比较
如果一个操作数是对象,则调用这个对象的valueOf方法,用得到的结果按照前面的规则执行比较。如果对象没有valueOf方法,则调用toString方法,并用得到的结果根据前面的规则进行比较
如果一个操作数是布尔值,则先将其转换为数值,然后再执行比较
任何数与NaN比较都是false

3.3.4 相等运算符

推荐使用全等运算符,则就没有类型转换的问题了。

3.3.5 三目运算符

3.3.6 赋值运算符

3.3.7 逗号运算符

  • 使用逗号运算符可以在一条语句中执行多个操作
  1. 同时声明多个变量

    var num1 = 1, num2 = 2, num3 = 3

  2. 用于赋值,逗号操作符总会返回表达式中的最后一项

    var num = (5, 1, 4, 8) num的值是8

3.5 语句

3.5.1 for-in语句

  • for-in语句是一种精准的迭代语句,可以用来枚举对象中的可被枚举的属性。

3.5.2 label语句

  • label语句可以在代码中添加标签,
    • 结合break语句和continue语句以便将来使用指定label标签来跳出或结束循环
label: for(var i =0;i< count;i++) {
    break label;
}
复制代码

3.5.3 with语句

var qs = location.search.substring(1)
var hostname = location.hostname
用with语句改写如下
with(location) {
    var qs = search.substring(1)
    var hostname = hostname
}
复制代码
  • with语句会导致性能下降,而且会导致代码调试困难。因为不建议使用with语句。
  • 而且严格模式下使用with语句,会视为语法错误

3.5.4 函数

函数用来封装多条语句。

  • 严格模式对函数有一些限制
    • 不能把函数命名为eval 和 arguments
    • 不能把参数命名为eval 和 arguments
    • 不能出现两个命名参数同名的情况

如果发现以上情况,就会导致语法错误,代码无法执行。

  • 函数不介意传递进来多少个函数,也不介意传进来的参数是什么数据类型,不需要识别函数签名。ecmascript没有这些条条框框。

  • 之所以会这样,是ecmascript中参数再内部是用一个数组表示的,命名的形参只提供了遍历,但不是必需的。

  • 函数体内部可以通过arguments来访问这个参数数组。 arguments 等于 参数数组。

  • 关于arguments的行为还有一点比较有意思的:

    • arguments的某个索引值 会 实时映射 命名参数的值。
    • 也就是说用arguments[x] 修改的值会实时映射到命名参数上面。反之亦是。
  • 严格模式下,对arguments进行赋值会导致语法错误。

  • 模拟重载:

    • 通过检查传入函数中参数的类型和数量并作出不同的反应,可以模拟重载。

4. 变量、作用域和内存问题

4.1 基本类型和引用类型的值

  • 基本数据类型值指的是简单的数据段,而引用类型值指哪些可能由多个值构成的对象。

  • JavaScript不允许直接访问内存中的位置,也就是说不能直接操作对象的内存空间。操作对象时操作的是对象的引用,而为对象添加属性时,是操作的是对象引用指向的堆内存数据对象。

  • 不能为基本数据类型添加属性或方法去使用,只能给引用类型值动态的添加属性或方法。

  • 基本数据类型和引用数据类型保存的方式不同,赋值的操作也不同。

    • 基本数据类型赋值,直接赋值值,两个变量参与的任何操作都不受影响。
    • 引用数据类型存放的是引用地址,是一个指针,改变一个另外也会改变。

4.2 传递参数

  • ecmascript中所有的函数的参数都是按值传递的。

    • 基本类型的传递如同基本类型变量的赋值一样,而引用类型的变量就如同引用数据类型的赋值那样。

    • 引用数据类型传递的该值在内存中的地址。按照常理来说地址是一串字符串,但是为什么可以进行对象的操作呢?

      • 可能是再进行对象操作的时候,该内存的地址会转换为对象的形式进行操作。
    • 证明对象是按值传递的

      function setName(obj) {
      	obj.name = "Nicholas"
          obj = new Object()
          obj.name = "Greg"
      }
      var person = new Object()
      setName(person)
      alert(person..name)   // "Nicholas"
      复制代码
    • 可以把ecmascript函数的参数想象成局部变量。

4.3 检测类型

  • 检测一个变量是否是基本数据类型用typeof, 因为引用数据类型使用typeof返回的总是Object / Function。

  • 因为通常我们并不想知道某个值是对象,而是想知道它是什么类型的对象。为此ecmascript提供了instanceof操作符。

    const result = variable instanceof constructor 变量 instanceof 构造函数 返回true/false

1587017103130

  • instanceof 只能对对象进行使用,对基本类型使用始终都返回false,因为基本类型不是对象。

4.4 执行环境和作用域

​ 执行环境是JavaScript中最为重要的一个概念。 执行环境决定了变量或函数有权访问的数据的集合,决定了它们的各自的行为。每个执行环境都有一个与之关联的变量对象。js解析器会把执行环境解析为一个变量对象。环境中所有的变量和函数都保存在这个对象中。

​ 全局执行环境是最外围的一个执行环境, 根据ecmascript实现所在的宿主环境不同,表示执行环境的对象也不一样。在web浏览器中被认为是window对象。 因此所有的全局变量和函数都是挂载到window对象上的。某个执行环境的所有代码执行完毕后,该环境被销毁,保存在其中的所有变量和函数定义也随之销毁。(全局执行环境直到应用程序退出后 — 例如关闭网页或者浏览器 — 时才会被销毁)。

​ 每个环境都i有自己的执行环境,当执行流进入一个函数时, 函数的环境就会被推入一个环境栈中。而在函数执行之后,栈将其环境弹出。将控制权返回给之前的执行环境。这就是ecmascript程序中执行流的机制。

当函数执行完毕之后,函数内的变量或行为被销毁,是其执行环境执行完毕之后被弹出,销毁其执行环境,其内部的数据也就被销毁了

4.4.1 作用域链

  • 当代码在一个环境中执行时,会创建变量对象的一个作用域链。这个作用域链可以寻找该执行环境所需要的变量和函数。作用域链类似于执行环境, 当需要一个变量或者函数时,会沿着这个作用域链一层层的去寻找到最外层作用域链,如果没有,则抛出错误。
  • 内部环境可以通过作用域链访问所有的外部环境,但外部环境不能访问内部环境中的任何变量和函数,这些环境之间是线性的、有次序性的。每个环境都可以向上搜索作用域链,查询标识符,但是任何环境都不能通过向下搜索作用域链而进入另一个执行环境。
  • 函数的参数也被当作变量来对待,因此其访问规则与执行环境中的其他变量相同。
  • 如果局部变量与外部变量标识符同名,则只能使用外部对象 .标识符 / [标识符] 进行访问。

4.4.2 垃圾收集

​ 垃圾回收机制的原理: 找出那些不再继续使用的变量。然后释放其占用的内存,为此垃圾收集器会按照固定间隔周期性执行这一操作

​ 主流: 标记清除法:

  • 当变量进入环境就被标记,当变量离开环境就去除标记。
  • 垃圾收集器在运行的时候会给存储在内存中所有的变量都加上标记,然后他会去掉环境中的变量以及被环境中的变量引用的变量的标记。 最后垃圾回收器完成内存清除的工作。销毁那些带标记的值,并回收他们所占用的内存空间。

引用计数法: 不太常见

​ 管理内存:

  • 我们可以手动将一个对象设置为null,接触该值的引用,方便下次垃圾回收器看到这个值可以直接回收,我们开发可以用这种方式进行管理内存。

4.5 总结

  1. 所有的变量都存在于一个执行环境(也称作用域)当中, 这个执行环境决定了变量的生命周期,以及哪一部分代码可以访问其中的变量。
    1. 执行环境有全局执行环境(也称全局环境) 和函数执行环境之分。
    2. 每次进入一个新的执行环境,都会创建一个用于搜索变量和函数的作用域链
    3. 函数的局部环境不仅有权访问函数作用域中的变量,而且有权访问其包含(父) 环境,乃至全局环境。
    4. 全局环境只能访问在全局环境中定义的变量和函数,而不能直接访问局部环境中的任何数据
    5. 变量的执行环境有助于确定何时释放内存。

5. 引用类型

5.1 Object

  • object是对象。是一组数据和功能的集合。无序的键值对的集合。其键一定是字符串。如果代码上不是字符串, js也会将其解析为字符串作为键。如果是对象或者是不符合变量命名规则的,则加上[]就行。
  • 通过字面量创建的对象,并不是调用了构造方法进行创建的。

5.2 Array

  • 通过字面量创建的对象,并不是调用了构造方法进行创建的。

  • 数组的length方法,不是只读的,也是 可写的。

    var colors =[1,2,3]
    colors[2]  // 3
    colors.length = 2
    colors[2]  // undefined
    复制代码
  • 检测数组, 尽管es提供了instanceof 来对引用了类型变量进行判断其类型。但 instanceof的问题在于:

    假定只有一个全局执行环境,但是网页中有多个框架,那么实际上就存在于两个以上不同的全局执行环境,从而存在两个以上的不同版本的Array的构造函数,如果你从一个框架向另一个框架传入一个数组,那么传入的数组与在第二个框架中原生创建的数组分别有各自不同的构造函数。而且两个tab栏之间进行通信时也会出现这个问题。

    • 解决办法: es5新增的Array.isArray(value) 方法。
  • 数组的很多方法……………

5.3 Function

  • 函数内部有两个特殊的对象
    1. arguments (参数集合)
    2. this (谁调用我指向谁)
  • 函数也是对象,函数有length 和 prototype属性。 每个函数都有apply、call、bind非继承得来的方法。

5.4 基本类型包装类

除了操作基本类型值,es还提供了3个特殊的引用变量: Boolean、Number和String, 这些类型与其他的引用类型相似,但是也具备各自的基本类型相应的特殊行为。实际上,每当读取一个基本类型值时,后台都会创建一个对应的基本包装类型的对象,从而让我们能够调用一些方法来操作数据。

这里建议永远不要使用Boolean对象,因为会造成一些难以理解的结果。

number类型的 一个可以很方便用来处理货币的方法 num.toFixed(2)

该方法的特性是能够按照指定的小数位返回数值的字符串表示,并且可以对小数位自动进行四舍五入

num.toExponential(2)

该方法返回以指数表示法表示的数值的字符串形式。传入的参数代表输入结果中的小数位数

num=10 num.toExponential(1) // "1.0e+1"

5.5 单体内置对象

内置对象的定义是: 由es实现提供的,不依赖于宿主环境的对象,这些对象在es程序执行之前就已经存在了。

例如: Object、Array、String, 还有Math 和 Global

5.5.1 Global对象

  • Global(全局)对象 可以说时es中最特别的一个对象了。因为你不管从哪个角度看这个对象都是不存在的。es中的global对象在某种意义上是作为一个兜底对象来定义的。换句话说,不属于任何其他对象的属性和方法,最终都是它的属性和方法。事实上,所有在全局作用域中定义的属性和函数,都是Global对象的属性。上述介绍过的诸如 isNaN() isFinite() parseInt().... 都是global对象的方法。Global对象是在es的任何环境都存在的。

    • URL编码方法

      Global对象的 encodeURI() 和 encodeURIComponent() 方法可以对uri进行编码。以便发送给浏览器。

      有效的uri不能包含类似于空格这种的非法字符,而这两个uri编码方法就可以对uri进行编码。

    • 为什么有呢?

    • 因为我们的访问地址如果是中文的,或者是带空格类似这种非法字符的,都要使用uri编码之后再发送给浏览器进行识别。

    • encodeURI不会对uri本身的特殊字符进行编码,比如http://www.baidu.com?wd=拼多多

      • 不会对 : // 这种进行编码
    • encodeURIComponent会将所有的非法字符进行编码。

    • 一般来说我们使用encodeURI对整个uri进行解析

    • 使用encodeURIComponent对uri的查询字符串进行解析

    • 使用decodeURI() 和 decodeURIComponent() 方法进行解码,但是前者解码不了 %23 因为%23是#

  • js的宿主环境如果是浏览器,则window对象就作为了Global对象的替身。

5.5.1 Math对象

  • 在所有的代码执行之前, 作用域中就已经存在了两个内置对象:Global和Math。
© 版权声明
THE END
喜欢就支持一下吧
点赞0 分享