面试题(JS)

基本数据类型

number string boolean null undefined symbol

underfined

变量的初始值
数组越界
函数默认返回值
访问对象没有的属性

引用数据类型

array object

判断数据类型

typeof
arr.constructor == Array
arr instanceOf Array
Array.isArray(arr)

继承

 function Animal(name, age) {
            this.name = name
            this.age = age
        }
        Animal.prototype.eat = function() {
            console.log("吃饭")
        }
        function Cat(name, age) {
            Animal.call(this, name, age) //执行父级的构造函数,替换this
        }
        Cat.prototype = new Animal()   //原型指向父类实例
        Cat.prototype.constructor = Cat  // constructor 指向自身
        var mimi = new Cat('xioami', 2)

捕获和冒泡

捕获从外往里,.冒泡从里往外
先捕获后冒泡

 var div = document.querySelector("div")
        div.addEventListener('click',function(){
            
        },true) //为true时先捕获后冒泡
        

 var div = document.querySelector("div")
        div.addEventListener('click',function(){
            
        },false) //默认先冒泡后捕获

事件对象

<div class="fa">
        <div class="son"></div>
    </div>
    <script>
        var fa = document.querySelector(".fa")
        var son = document.querySelector(".son")
        fa.addEventListener('click', function(e) {
            console.log(e.target); //触发事件的对象 
            console.log(this);  // 绑定事件的对象 


        })
    </script>

阻止事件冒泡和默认行为

    e.preventDefault() //阻止默认事件
            e.stopPropagation() //阻止冒泡

事件委托

  <button id="btn">11</button>
    <ul>
        <li>ss</li>
        <li>ff</li>
    </ul>
    <script>
        var oul = document.querySelector('ul')
        var btn = document.querySelector('#btn')
        btn.addEventListener('click', function() {
            var oli = document.createElement('li')
            oli.innerHTML = Math.random()
            oul.appendChild(oli)
        })
        oul.addEventListener('click', function(e) {
            console.log(e.target.innerHTML);

        })
    </script>

动态绑定事件,
减少内存消耗

jQuery的事件委托