前端面试题精选（4）

二十七、请写简单写一个js继承

    //1、原型链继承,使用 prototype 属性

    //解释：把父亲的原型对象，指向 高百万 就可以被父亲的实例儿子继承
    function GaoBW() {
        this.car = '兰博基尼';
        this.house = '大别墅';
    }

    function Father(n, a) {
        this.name = n;
        this.age = a;
    }
    Father.prototype = new GaoBW();
    var son = new Father('张三', 18);
    console.log(son.name, son.age, son.car, son.house) //张三 18 兰博基尼 大别墅
    console.log(son.constructor) //发现高百万居然成了 son  的爹，
    // 以上继承方式会使继承链紊乱，需要手动调节，这个爸爸告诉高百万我才是的你爹！
    Father.prototype.constructor = Father;
    console.log(son.constructor) //这时 son 的爹 是 Father

    // 2、原型链继承-直接继承
    // 解释：由于 高百万 对象中不变的属性都可写入高百万的爹中，这时 Father 可以直接跳过高百万，直接继承高百万的爹，
    // 注意：这时 高百万 与 Father 成为了兄弟关系

    function GaoBW() {}
    GaoBW.prototype.car = '兰博基尼';
    GaoBW.prototype.house = '别墅';

    function Father(n, a) { // 原型对象 Father
        this.name = n;
        this.age = a;
    }
    //这两个人拜把子，称为了兄弟，要一起坐拥百万
    Father.prototype = GaoBW.prototype;
    // 实例对象 son 继承 Father
    var son = new Father('张三', 18); //实例对象 son
    console.log(son.name, son.age, son.car, son.house) //张三 18 兰博基尼 大别墅
    console.log(son.constructor); //第一次son的爹是 高百万
    Father.prototype.constructor = Father; //手动修改继承连
    console.log(son.constructor); //这一次son 的爹是Father

    // 这种继承方式可以Father修改 祖先的财富，这样是非常不合理的
    Father.prototype.car = '五菱宏光';
    Father.prototype.house = '小破楼';
    console.log(GaoBW.car, GaoBW.house) //五菱宏光 小破楼  这样能够修改那就太惨了

    // 3、利用空对象继承
    // 解释：使用一个空对象来继承 高百万 祖先的财产，Father来继承空对象的财产，Faher想更改高百万的财富，但是修改不了。

    function GaoBW() {}
    GaoBW.prototype.car = '兰博基尼';
    GaoBW.prototype.house = '别墅';
    // 创建一个空对象
    function Null_() {}
    // Null 继承 高百万祖先的财富
    Null_.prototype = GaoBW.prototype;

    function Father(n, a) {
        this.name = n;
        this.age = a;
    }

    Father.prototype = new Null_()
    var son = new Father('张三', 18);
    console.log(son.name, son.age, son.car, son.house) //张三 18 兰博基尼 别墅
    Father.prototype.car = '五菱宏光';
    var gao = new GaoBW();
    console.log(gao.car); //兰博基尼  这时 Father 已经修改不了GaoBW的继承的财产了

    // 4、使用构造函数来实现绑定继承
    function Father(c, h) {
        this.car = c;
        this.house = h
    }

    function son(n, a) {
        this.name = n;
        this.age = a;
        // Son 继承     Father
        // a.call(b,age11,age2)
        // a.apply(b,[age11,age2])
        // Father.call(this, '大众', '捷达');
        Father.apply(this, ['大众', '捷达']);
    }
    var son_ = new son('张三', 18);
    console.log(son_.name, son_.house); //张三 捷达

二十八、事件监听和绑定事件的区别

1、首先是写法不一样，绑定事件是不可以重复使用，

2、事件监听 xx/addEventListener('click',function(){})不写on, 且能改变事件流（冒泡，捕获(js正常执行顺序)）默认 false （冒泡），true(捕获)

3、普通事件就是在标签上

4、事件绑定: button.οnclick=function(){}

二十九、window.onload 和 document.ready 的区别？

1、load 要等到图片和包含的文件都加在进来之后执行也就是说 ，是在结构和样式加载完才执行 js

2、ready 是不包含图片和非文字文件的文档结构准备好就执行；且Document.ready 原生中没有这个方法，jquery 中有 $().ready(function)

三十：如何优化自己的代码？

1、避免代码重用

2、避免全局变量（命名空间，封闭空间，模块化 mvc..）

3、避免拆分函数避免函数过于臃肿：

应遵循单一职责原则，适当的注释，尤其是一些复杂的业务逻辑或者是计算逻辑，都应该写出这个业务逻辑 的具体过程

4、注意内存管理，尤其是闭包中的变量释放。

三十一：请问get和post的区别？