js基础知识【前端面试】

值和引用

值在栈中保存上->下

引用在堆中保存下->上

深拷贝

问题：一个对象复制为另一个对象的时候，由于存放在堆区（具体再看），因此改变复制对象后源对象也会发生变换，因此需要深拷贝。

思路：

　　1.首先判断该变量类型是否为对象，不是则直接return

　　2.然后判断该变量类型为数组还是对象，创建相应的空的变量。

　　3.循环遍历一下对象的内容，如果都是他的本身属性（非原型属性），那么就递归调用该函数实现深拷贝。由于到末端的值都不为对象，因此在递归的时候会return出去然后赋值给上级的key，完成深拷贝。

const obj1={
  name:'张三',
  age:18,
  address:{
    city:'上海'
  },
  arr:['a','b','c']
}

const obj2=deepClone(obj1)
obj2.address.city="北京"
console.log('obj1是'+obj1.address.city, '')
console.log('obj2是'+obj2.address.city, '')

function deepClone(obj) {
  if(typeof obj !=='object'||obj==null){
    return obj
  }
  let res 
  // 判断是否为数组
  if(obj instanceof Array){
    res=[]
  }else{
    res ={}
  }
  for(let key in obj){
    // 保证key不是原型的属性
    if(obj.hasOwnProperty(key)){
      // 递归调用 防止深层次的东西没有复制过来
      res[key]=deepClone(obj[key])
    }
  }
  return res
}

字符串拼接

问题

1.typeof能判断哪些类型

值类型函数引用

2.何时使用 === 以及 ==

除了null之外

3.值类型与引用类型的区别

4.深拷贝

原型

继承

extend 继承父类

super 执行父类构造

instanceof为类型判断

每个class都有显式原型 prototype

每个实例都有隐式原型__proto__

隐式原型指向显式原型，隐式找不到就去显示去找

(原型存放方法)

原型链

父.prototype===子.prototype.__proto__

hasOwnProperty() //验证是否为自身属性

问题

1.判断一个变量是否为数组

instanceof Array

2.手写简易的jquery

没搞懂

class jQuery {
    constructor(selector) {
        const result = document.querySelectorAll(selector)
        const length = result.length
        for (let i = 0; i < length; i++) {
            this[i] = result[i]
        }
        this.length = length
        this.selector = selector
    }
    get(index) {
        return this[index]
    }
    each(fn) {
        for (let i = 0; i < this.length; i++) {
            const elem = this[i]
            fn(elem)
        }
    }
    on(type, fn) {
        return this.each(elem => {
            elem.addEventListener(type, fn, false)
        })
    }
    // 扩展很多 DOM API
}

// 插件
jQuery.prototype.dialog = function (info) {
    alert(info)
}

// “造轮子”
class myJQuery extends jQuery {
    constructor(selector) {
        super(selector)
    }
    // 扩展自己的方法
    addClass(className) {

    }
    style(data) {
        
    }
}

// const $p = new jQuery('p')
// $p.get(1)
// $p.each((elem) => console.log(elem.nodeName))
// $p.on('click', () => alert('clicked'))

3.class原型本质

js基础知识【前端面试】

推荐阅读