js一些经典题

作者: 扶搏森 | 来源:发表于2017-10-21 18:45 被阅读8次

题1

1.1

//js谁调用this,this就指向谁
this.a=20;
var p={
    a:30,
    test:function(){
        alert(this.a);
    }
};
p.test();

1.2

//js谁调用this,this就指向谁
this.a=20;
var p={
    a:30,
    test:function(){
        alert(this.a);
    }
};
//s -> window
var s=p.test;
s();

1.3

//js谁调用this,this就指向谁
this.a=20;
var p={
    a:30,
    test:function(){
        function s(){
            alert(this.a);
        }
        return s;
    }
};
(p.test())();

题2

闭包的内存泄漏

function f1(){
    var N=0;
    function f2(){
        N+=1;
        console.log(N);
    }
    return f2;
}
var result=f1();
result();
result();
result();

打印的值

1
2
3

说明N一直在内存里,从而导致内存泄漏,执行了一次result()时返回函数f2,此时不知道是不是还要执行result函数,所以N一直在内存中,浏览器的垃圾回收机制就不会回收N,要想回收N,设置result=null

题3

请在下面写出JavaScript面向对象编程的混合式继承。并写出ES6版本的继承。 要求:汽车是父类,BMW是子类。父类有颜色、价格属性,有售卖的方法。BMW子 类实现父类颜色是红色,价格是140000,售卖方法实现输出如下语句:将 红色的BMW 买给了小王价格是14万

var Car=function(){
    //constructor==Car 构造函数和初始化这个类就是一个东西
}
var s=new Car();
console.log(s);

此时打印的constructor.name为Car

var Car=function(color){
    this.color=color;
}
Car.prototype.sail=function(){
    console.log(this.color+'色的车卖了13w');
};
var BWM=function(){

}
//按引用传递
BWM.prototype=Car.prototype;
BWM.prototype.test=function(){

}
var s=new Car('red');
console.log(s);

子类BWM继承了Car,但是也改变了父类Car的prototype,多了test方法

var Car=function(color){
    console.log(111);
    this.color=color;
}
Car.prototype.sail=function(){
    console.log(this.color+'色的车卖了13w');
};
var BWM=function(color){
    Car.call(this,color);
}
BWM.prototype=new Car();
var m=new BWM('red');
console.log(m);

执行结果

111
111
BWM {color: "red"}

Car里面执行了2次,BWM里面的constructor.name为Car

需要做到

  • 拿到父类原型链上的方法
  • 不能让构造函数执行2次
  • 引用的原型链不能是按址引用
  • 修正子类的constructor
var Car=function(color){
    console.log(111);
    this.color=color;
}
Car.prototype.sail=function(){
    console.log(this.color+'色的车卖了13w');
};
var BWM=function(color){
    Car.call(this,color);
}
//Object.create原型链的副本
var __pro=Object.create(Car.prototype);
__pro.constructor=BWM;
BWM.prototype=__pro;
var m=new BWM('red');
console.log(m);

题4

(function(){
    var a=20;
    function a(){

    }
    alert(a);
})();

函数和变量都会向前提升,函数提升比变量提升多,导致代码变成

(function(){
    //函数跑到最前面了
    function a(){

    }
    var a;
    a=20;
    alert(a);
})();

题5

(function(){
    var a=20;
    var b=c=a;
})();
alert(c);

根据变量向前提升,得到

var c;
(function(){
    var a=20;
    var b=20;
    c=20
})();
alert(c);

题6

var user={
    age:20,
    init:function(){
        console.log(this.age);
    }
}
var data={age:40};
var s=user.init.bind(data);
s.init();

结果

40

题7

function test(m){
    m.v=20;
}
var m={age:30};
test(m);
alert(m.v);

对象是按引用传递

<!--html部分-->
<ul>
    <li>1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
</ul>

//js部分
var list_li=document.getElementsByTagName('li');
for(var i=0;i<list_li.length;i++){
    (function(i){
        list_li[i].onclick=function(){
            console.log(i+1);
        }
    })(i);
}

//或者
var list_li=document.getElementsByTagName('li');
for(var i=0;i<list_li.length;i++){
    list_li[i].index=i;
    list_li[i].onclick=function(){
        console.log(this.index+1);
    }
}

//或者
var list_li=document.getElementsByTagName('li');
for(let i=0;i<list_li.length;i++){
    list_li[i].onclick=function(){
        console.log(i+1);
    }
}

总结

  • 立即执行函数
  • 闭包 内部函数可以访问外部函数的变量,把函数返回出去,闭包可以保护内部的变量 闭包内存泄漏==null
  • 原型链
    1. 构造函数里的属性的优先级比原型链的要高
    2. 面向对象编程的时候JS没有类的概念 可以用函数代替
    3. constructor 实际就是对应的那个函数
    4. prototype 按引用传递的,Object.create原型链的副本
  • 数值 字符串 布尔类型 按值传递,其他都是按引用传递 对象~数组~
  • 改变this的方法 call apply bind
  • 函数提升 变量提升 函数提升的级别要比变量高
  • 异步队列后执行,同步队列先执行

相关文章

  • js一些经典题

    题1 1.1 1.2 1.3 题2 闭包的内存泄漏 打印的值 说明N一直在内存里,从而导致内存泄漏,执行了一次re...

  • js经典逻辑题

    经过这几天的学习,相信大家对js有了初步的了解,那如何让js变得好玩呢?那我出几道简单的逻辑题,大家和我一起动动聪...

  • JS能力测评经典题1

    地址:https://www.nowcoder.com/ta/js-assessment 题目描述# 找出元素 i...

  • JS能力测评经典题2

    不考虑算法复杂度,用递归做: slice 参数 : slice(start,end); slice 方法,在str...

  • 一些js编程题

    数组扁平化 例:输入:[[1, 2, 2], [3, 4, 5, 5], [6, 7, 8, 9, [11, 12...

  • 任务11

    第一题 http://js.jirengu.com/mekep第二题 http://js.jirengu.com/...

  • 在Nodejs或浏览器运行ESM代码

    前言 经典面试题目就是《Common.js和ES module的区别》,这一题很多人都会熟练地背出答案。 Comm...

  • 经典题

    1. 相反数为了得到一个数的"相反数",我们将这个数的数字顺序颠倒,然后再加上原先的数得到"相反数"。例如,为了得...

  • js题

    1、 2、 3、 4、

  • js题

    1、数据类型 JavaScript共有八种数据类型,分别是 Undefined、Null、Boolean、Numb...

网友评论

    本文标题:js一些经典题

    本文链接:https://www.haomeiwen.com/subject/takruxtx.html