原生js杂谈

前端基础可谓非常重要，这一篇是我对一些原生js的概念和使用上的一些小记录，也就是一些原生js的杂谈，看博文的同学，希望我们可以互相交流哈哈哈

正文

判断对象的类型

使用toString()方法进行判断，toString方法是写在Object原型上的，也就是说在默认情况下每一个Object对象都会继承toString方法，如果此方法没有在自定义对象里被覆盖，那么toString返回的是[object type]，type就是该对象的类型，那么我们使用.call()或者.apply()的调用方式就可以在不同对象类型上使用这个toString，比如下面toString().call(val),这里的toString()是Object.prototype.toString，这样我再进行一些替换和切分操作就可以获得对象的type

let val = new Date()
toString.call(val).replace(/[\[\]]/g,'').split(' ')[1].toLowerCase()
复制代码

一个更新states的块

(function () {
  //状态
  const states = {
    a: null,
    b: {}
  }
  //获取对应属性的值
  function get(name) {
    return states.mame
  }
  //获取states对象
  function getStates() {
    return states
  }
  //判断对象类型
  function type(elem) {
    if (elem == null) {
      return elem + ''
    }
    return toString.call(elem).replace(/[\[\]]/, '').split(' ')[1].toLowerCase()
  }
  //设置或更新states
  function set(options, target) {
    const keys = Object.keys(options)
    let o = target ? target : states
    keys.map(item => {
      if (o[item] === undefined) {
        o[item] = options[item]
      } else {
        type(o[item]) == 'object' ? set(options[item], o[item]) : o[item] = options[item]
      }
      return item
    })
  }
  //通过外部环境保持引用变为公用方法
  window.get = get
  window.getStates = getStates
  window.set = set
})();
set({
  a: 1,
  b: {
    name: 'joe',
    age: 24
  }
})
console.log(getStates())
复制代码

url转码

解码 decodeUrlComponent 打码 encodeUrlComponent

数组操作

.pop()删除数组最后一个值，返回被删除的值 .shift()删除数组第一个值，返回被删除！！的值 .push() 在数组最后添加一个值，返回数组长度 .unshift() 在数组最前面添加一个值，返回数组长度 不改变原来数组:slice(),join(),concat() 改变原来数组:pop(),push(),shift(),unshift(),reverse(),splice()

运算符+的转换

今天在群里有同学提问一个问题，题目是[+[]][+[]]的结果是多少，这个就要联系到+号运算符的隐式转换，在一元运算符中使用加法运算时会把加号后面的值转化成Number类型

Number([])//0
[+[]][+[]] => [0][0] => 0
复制代码

forEach、map、reduce、filter

forEach是遍历数组每一项的值，然后让每个值都执行一次回调函数，会改变原数组 map 是对数组每一项进行操作，然后返回一个新的数组，，不改变原数组 reduce 是利用递归的原理对所有数值进行操作返回一个值 filter 是把符合条件的数值给挑选出来，返回一个新数组，不改变原数组，新数组的值是浅拷贝也就是引用传递，可以通过filter来筛选出想操作的值，然后直接对返回的数组进行操作

set结构做数组去重

非常简单的方法，直接将数组转化成set结构，然后再将set结构转为数组，Array.from可以将set结构转化为数组结构，当然也可以直接用解构的方式[...new Set(array)]

//去重函数
function dedupe (array) {
  return Array.from(new Set(array))
}
复制代码