随堂笔记

undefined与null

• typeof undefined === 'undefined'
• typeof null === 'object'
• null == undefined 正确
• null === undefined 错误
• 使用void 0获取undefined值,eg：

let b = void 0 
//b === undefined

原型与原型链

• 具体参考：http://cavszhouyou.top/JavaScript%E6%B7%B1%E5%85%A5%E7%90%86%E8%A7%A3%E4%B9%8B%E5%8E%9F%E5%9E%8B%E4%B8%8E%E5%8E%9F%E5%9E%8B%E9%93%BE.html
• 实例与构造函数及函数的原型对象之间的关系
  • 构造函数存在prototype属性
  • 实例存在 _ proto _ 属性

  • 实例与函数的原型对象存在关系！！！！（与构造函数构不成连接关系）

    
    image.png

function Person(){

}
var student = new Person();
console.log(student.__proto__ === Person.prototype); // true

• 获取函数原型对象的三种方法
  • p._ proto _
  • p.constructor.prototype
  • Object.getPrototypeOf(p)

  function Person () {
  }
  Person.prototype.name = '111'
  const stu = new Person()
  stu.__proto__
  //  {name: "111", constructor: ƒ}
  stu.constructor.prototype
  //  {name: "111", constructor: ƒ}
  Object.getPrototypeOf(stu)
  // {name: "111", constructor: ƒ}
  

数字类型

• 整数的安全范围：正负2^53 - 1，大概是16位（Number.MAX_SAFE_INTENGER、Number.MIN_SAFE_INTENGER）

• NaN !== NaN 是对的，为number类型

• isNaN()和Number.isNaN()的区别

  • isNaN，会先做数字类型转化，再判断是否为NaN

  能转化为数字的比较是否为NaN，不能的返回true

    // 比较字符串类型
    isNaN('') // false   空字符串能转化为0
    isNaN('123') // false
    isNaN('aaa') //true
    // 比较数字类型
    isNaN(1) // false
    isNaN(NaN) // true
  

  • Number.isNaN, 会先判断是否为数字类型，不是则返回false，是则进行比较判断是否为NaN

  直接比较不进行数字类型转换

   // 比较字符串类型
      Number.isNaN('') // false   
      Number.isNaN('123') // false
      Number.isNaN('aaa') // false
      // 比较数字类型
      Number.isNaN(1) // false
      Number.isNaN(NaN) // true
  

• 数字类型转化

  +undefined // NaN
  +null // 0
  +[2] // 2
  +[2,3] //NaN
  

数组

• 只有一个数字参数时，参数代表了数字长度，传个数组进去则为数组

  let a = new Array(2) // a = [,] 
  let b = new Array([2]) // b = [2]
  

• 排序sort()方法：默认按照Unicode位点进行排序，若参数传一个方法，则按照方法排序,小于0位置不调换，大于0位置调换，从小到大排序的话，方法compare(a,b),直接返回一个a-b

  // eg：100会排在11的前面，原因为第一位相同，则比较第二位
  const a = [11,100]
  a.sort() //[100,11]
  // 从小到大排序
  a.sort((a, b) => a-b)  // [11,100]
  

• 增删方法splice(a,b,item1,item2...)
  a：表示从第几位开始，包括这一位，数组存在第0位
  b：增加或删除，大于0时表示删除几位，小于等于0时表示新增，新增时可直接写0，不管新增几位
  item：删除时不写，新增时，写新增的信息
  返回值：被删除的项组成的数组(新增时，返回空数组)

  // 新增
  const a = [1,2]
  const result = a.splice(1,0,3,4,5)
  a // [1,3,4,5,2]
  result // []
  // 删除
  const b = [1,2,3,4,5]
  const result = b.splice(1, 2)
  b // [1,4,5];
  result // [2,3]
  

布尔（Boolean）类型

• 不同类型转化为布尔类型

  !!null // false
  !!undefined //false
  !!NaN // false
  

valueOf 和 toString

• valueOf返回的值为本身

  // 对象
  let a = {}
  let b = {a: 1}
  a.valueOf() // {}
  b.valueOf() // {a: 1}
  // 数组
  let c = []
  let d = [2]
  c.valueOf() // []
  d.valueOf() // [2]
  

• toString可能存在差异
  • 值为对象时,返回："[object Object]"

  let a = {}
  let b = {a: 1}
  a.toString() // "[object Object]"
  b.toString() // "[object Object]"
  

  • 值为数组时,返回:内部值做toString转换，拼接在一起(ps:数组套数组则按此规则深入转化)

  let c = []  c.toString()  // ""
  let d = [2]  d.toString() // "2"
  let e = ['3'] e.toString() // "3"
  let f = ['f'] f.toString()  // "f"
  let g = [2, 3]  g.toString() // "2,3"
  let a = [{b:1}, {c:1}]  a.toString() // "[object Object],[object Object]"
  let b = [[2],[3]] b.toString() // "2,3"
  

特殊字符

• ～， 反向取整 ，等于value = -(x+1),如果value有小数，则直接舍弃

~2.1 // -3
~0 // -1
~-2.1 // 1

解析字符串和强制类型转换有什么区别

• 解析字符串，出现非数字类型后会停止解析，返回房前解析过的数字举例：parseInt

  parseInt('123adff11')// 123
  

• 强制类型转换，不允许存在非数字的情况，如存在则返回NaN，举例：Number ()

  Number('123adff')// NaN
  

操作符（==，>, <等）强制类型转换规则

• 字符串与数字，字符串转化为【数字】(含有字母的则转为NaN)，再与数字比较

  '11' == 11 // true
  

• 布尔值与其他，布尔值转化为【数字】，true为1，false为0，再与其他比较

  true == 1 // true
  true < '2' //true
  

• 数组与数组/对象与对象，比较的是地址是否相同，地址相同则比较后会返回true,地址不同，即便值相同也返回false

  // 地址相同
  let a = [1]
  let b = a;
  b[1] = 2;
  b == a // true
  //地址不同
  let a = {a:1}
  let b = {a:1}
  b == a // false
  

this 指针

this到对象的绑定发生在函数调用时，而不是函数定义时

this 指向最后一次调用这个方法的对象(存在很多次调用，比如先进行bind绑定之后又作为构造器生成实例，那么最后只会按照构造器调用模式处理，即实例上有则有，无则无)

优先级：构造器>bind、apply、call>方法调用>函数调用

• 方法调用模式：调用的对象
  使用“.”、“[]”等方法调用模式，调用方法

  var a = 1;
  var obj = {
    a: 10,
    b: function fun() {
      return this.a;
    }
  }
  obj.b()   // 10
  

• 函数调用模式：全局对象
  直接调用

  var a = 1;
  function fun() {
      var a = 10;
      return this.a;
  }
  fun()  // 1
  

• 构造器调用模式：生成的实例对象
  使用new生成新的实例后调用

  function Person (name) {
   this.name = name
  }
  var stu = new Person('xiao ming')
  stu.name  // "xiao ming"
  

• bind、apply、call调用模式：传入的绑定对象
  方法中传入相应的参数，上述三个方法中第一个参数全都是要绑定的对象，apply第二个参数为数组，call剩下的参数为调用方法中需要的参数（散点的，不是数组）。方法.bind(对象)，方法.apply(对象, [参数])，方法.call(对象, 参数1，参数2....)

  var name = 1;
  var person = {
    name: ''
  }
  function setName(first,last) {
    this.name = first + last;
  }
  setName.apply(person, ['xiao','ming'])
  person.name // "xiaoming"
  name // 1
  

DOM和BOM

• DOM：文档对象模型，将html内容和方法转化为的对象，包含document
• BOM：浏览器对象模型，核心为window，包含：navigator、history
  、screen、location、document