this常见面试题汇总

四.常见面试题汇总（关于this）

<script>
     全局中的this表示window
     this.a = 20 // 给window对象上挂了一个a属性，值是20
     var test = {
       a: 40,
        init: function () {
           // this出现在一个对象的函数中，this的值表示当前对象
         console.log(this.a)
    }
   }
    test.init()
</script>
2
<script>
    // this.a = 20
    // var test = {
    //     a: 40,
    //     init: function () {
    //         console.log(this.a)
    //     }
    // }
    // // fn是window上的一个属性
    // var fn = test.init
    // fn(); // window.fn()
</script>
3
<script>
    // this.a = 20
    // var test = {
    //     a: 40,
    //     init: function () {
    //         // go不是window的属性
    //         function go(){
    //             console.log(this)  // Window
    //             console.log(this.a) // 20
    //         }
    //         // 由于不是test调用了go函数，那么go中的this不可能是test
    //         //
    //         go();
    //     }
    // }
    // test.init()
</script>
4
<script>
    // this.a = 20
    // var test = {
    //     a: 40,
    //     init: function () {
    //         function go() {
    //             console.log(this.a)
    //         }
    //         return go;
    //     }
    // }
    // var s = test.init()
    // s();  // 20
</script>
5
<script>
    // function test(a){
    //     this.a = a;
    // }
    // test.prototype.a = 20;
    // test.prototype.init = function(){
    //     console.log(this.a)
    // }
    // var s = new test(30);
    // // s.init();  // 30
    // test.prototype.init();  // 20
</script>
<script>
    // this.a = 20;
    // var test = {
    //     a:40,
    //     init:function(){
    //         console.log(this.a)
    //     }
    // }
    // ;(function(){
    //     var fn = test.init;
    //     fn()  // 20
    // })()
    // TypeError: {(intermediate value)(intermediate value)} is not a function
</script>
6
<script>
    // var f = function(a){
    //     return a;
    // }
    // var f = (a)=>{
    //     return a;
    // }
    // var f = a=>{
    //     return a;
    // }
    // var f = a=>a;
    // 箭头函数中没有this
</script>
<script>
    // this.a = 20;
    // var test = {
    //     a:40,
    //     init:()=>{
    //         // 箭头函数中没有this
    //         console.log(this.a)
    //     }
    // }
    // test.init()  // 20
</script>
<script>
    // this.a = 20;
    // var test = {
    //     a: 40,
    //     init: function() {
    //         console.log(this.a)
    //     }
    // }
    // var s = test.init.bind(this)
    // s();
</script>
7
<script>
    // var s = {
    //     a:function(){
    //         console.log(1)
    //     },
    //     b:function(){
    //         console.log(this)  // 表示当前这个对象
    //     }
    // }
    // var s = {
    //     a:function(){
    //         console.log(1)
    //     },
    //     b(){
    //         console.log(this)  // 表示当前这个对象
    //     }
    // }
    // s.b()
</script>
<script>
    // var s = {
    //     a: function () {
    //         console.log(1)
    //     },
    //     b() {
    //         console.log(2)
    //     }
    // }
    // var f = s.a.bind(this)
    // new f();
    // var p = s.b.bind(this)
    // new p();
</script>
8
<script>
    // this.test = 11;
    // var s = {
    //     a: function () {
    //         console.log(this)
    //     }
    // }
    // var f = s.a.bind(this)
    // // f()
    // // new f();
</script>
<script>
    // this.test = 11;
    // var s = {
    //     a: function () {
    //         console.log(1+this.test)
    //     }
    // }
    // var f = s.a.bind(this)
    // new f();
</script>
<script>
    // this.test = 11;
    // var s = {
    //     a:()=>{
    //         console.log(1 + this.test)
    //     }
    // }
    // var f = s.a.bind(this)
    // new f();
</script>
9
<script>
    // function C2(a){
    //     this.a = a;
    // }
    // C2.prototype.a = "lao";
    // // console.log((new C2().a))  // undefined
    // console.log((new C2("xxx").a))  // xxx

    // function C2(a){
    //     a = 110;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2().a))  // lao


    // function C2(a){
    //     var a = 110;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2().a))  // lao

    // function C2(a){
    //     // SyntaxError: Identifier 'a' has already been declared
    //     let a = 110;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2().a))  // lao
</script>
10
<script>
    // function C2(a) {
    //     this.a = a;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2()).a)  // undefined
    // console.log((new C2().a))  // undefined
</script>
11
<script>
    // function test(a){
    //     this.a = a;
    // }
    // test.prototype.a = 20;
    // test.prototype.init = function(){
    //     console.warn(this.a)
    // }
    // var s = new test();
    // s.init(); //undefined
</script>
12
<script>
    // function C1(name) {
    //     if (name) this.name = name;
    // }
    // function C2(name) {
    //     this.name = name;
    // }
    // function C3(name) {
    //     this.name = name || 'fe';
    // }
    // C1.prototype.name = "aaa";
    // C2.prototype.name = "bbb";
    // C3.prototype.name = "ccc";
    // // aaaundefinedfe
    // console.log((new C1().name) + (new C2().name) + (new C3().name));
</script>
13
<script>
    var a;
    // 一个undefiend和字符串拼接得到的是字符串
    var str = a + "hello"
    console.log("............."+str)
    function A(name){
        this.name = name;
        console.log(this)<script>
    // 把一个匿名函数赋给f
    // var f = function(){}

    // g是函数名  对于函数表达式来说，可以指定函数名
    // var f = function g(){console.log("haha...")}
    // f()
    // 不能通过函数表达式的函数名来调用函数
    // g() // g is not defined

    // 对于函数表达式的函数名，可以在函数体中使用
    // var f = function g(){
    //     console.log(g) // g是函数名，可以在函数体中使用
    //     // g();  // 可以通过g()调用这个函数，但是没有出口会死循环

    //     // g = 1;  // 把基本数据类型赋值给g没有作用
    //     // g = []; // 引用数据类型赋值给g也没有作用
    //     // g = {};
    //     g = function(){
    //         console.log("xixi...")
    //     }
    //     console.log(g)
    // }
    // f()

    // 对于函数表达式来说，它可以有函数名，不能在函数外面通过函数名调用这个函数，可以在函数内部使用函数名或函数调用（死循环），不能给这个函数名重新赋值

    // var a = function abc(num) {
    //     abc = num;
    //     console.log(num)   // 1
    //     console.log(abc)   //  abc是一个函数
    //     console.log(typeof abc)  // function
    // }
    // a(1)
</script>
14
<script>
    // var a = function abc(num) {
    //     abc = num;
    //     return 1;
    // }
    // a(1)
    // console.log(abc())// ReferenceError: abc is not defined
</script>
<script>
    // 全局中的this表示window
    // this.a = 20 // 给window对象上挂了一个a属性，值是20
    // var test = {
    //     a: 40,
    //     init: function () {
    //         // this出现在一个对象的函数中，this的值表示当前对象
    //         console.log(this.a)
    //     }
    // }
    // test.init()
</script>
15
<script>
    // this.a = 20
    // var test = {
    //     a: 40,
    //     init: function () {
    //         console.log(this.a)
    //     }
    // }
    // // fn是window上的一个属性
    // var fn = test.init
    // fn(); // window.fn()
</script>
16
<script>
    // this.a = 20
    // var test = {
    //     a: 40,
    //     init: function () {
    //         // go不是window的属性
    //         function go(){
    //             console.log(this)  // Window
    //             console.log(this.a) // 20
    //         }
    //         // 由于不是test调用了go函数，那么go中的this不可能是test
    //         //
    //         go();
    //     }
    // }
    // test.init()
</script>
<script>
    // this.a = 20
    // var test = {
    //     a: 40,
    //     init: function () {
    //         function go() {
    //             console.log(this.a)
    //         }
    //         return go;
    //     }
    // }
    // var s = test.init()
    // s();  // 20
</script>
<script>
    // function test(a){
    //     this.a = a;
    // }
    // test.prototype.a = 20;
    // test.prototype.init = function(){
    //     console.log(this.a)
    // }
    // var s = new test(30);
    // // s.init();  // 30
    // test.prototype.init();  // 20
</script>
17
<script>
    // this.a = 20;
    // var test = {
    //     a:40,
    //     init:function(){
    //         console.log(this.a)
    //     }
    // }
    // ;(function(){
    //     var fn = test.init;
    //     fn()  // 20
    // })()
    // TypeError: {(intermediate value)(intermediate value)} is not a function
</script>
18
<script>
    // var f = function(a){
    //     return a;
    // }
    // var f = (a)=>{
    //     return a;
    // }
    // var f = a=>{
    //     return a;
    // }
    // var f = a=>a;
    // 箭头函数中没有this
</script>
19
<script>
    // this.a = 20;
    // var test = {
    //     a:40,
    //     init:()=>{
    //         // 箭头函数中没有this
    //         console.log(this.a)
    //     }
    // }
    // test.init()  // 20
</script>
20
<script>
    // this.a = 20;
    // var test = {
    //     a: 40,
    //     init: function() {
    //         console.log(this.a)
    //     }
    // }
    // var s = test.init.bind(this)
    // s();
</script>
21
<script>
    // var s = {
    //     a:function(){
    //         console.log(1)
    //     },
    //     b:function(){
    //         console.log(this)  // 表示当前这个对象
    //     }
    // }
    // var s = {
    //     a:function(){
    //         console.log(1)
    //     },
    //     b(){
    //         console.log(this)  // 表示当前这个对象
    //     }
    // }
    // s.b()
</script>
22
<script>
    // var s = {
    //     a: function () {
    //         console.log(1)
    //     },
    //     b() {
    //         console.log(2)
    //     }
    // }
    // var f = s.a.bind(this)
    // new f();
    // var p = s.b.bind(this)
    // new p();
</script>
23
<script>
    // this.test = 11;
    // var s = {
    //     a: function () {
    //         console.log(this)
    //     }
    // }
    // var f = s.a.bind(this)
    // // f()
    // // new f();
</script>
24
<script>
    // this.test = 11;
    // var s = {
    //     a: function () {
    //         console.log(1+this.test)
    //     }
    // }
    // var f = s.a.bind(this)
    // new f();
</script>
25
<script>
    // this.test = 11;
    // var s = {
    //     a:()=>{
    //         console.log(1 + this.test)
    //     }
    // }
    // var f = s.a.bind(this)
    // new f();
</script>
26
<script>
    // function C2(a){
    //     this.a = a;
    // }
    // C2.prototype.a = "lao";
    // // console.log((new C2().a))  // undefined
    // console.log((new C2("xxx").a))  // xxx

    // function C2(a){
    //     a = 110;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2().a))  // lao


    // function C2(a){
    //     var a = 110;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2().a))  // lao

    // function C2(a){
    //     // SyntaxError: Identifier 'a' has already been declared
    //     let a = 110;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2().a))  // lao
</script>
27
<script>
    // function C2(a) {
    //     this.a = a;
    // }
    // C2.prototype.a = "lao";
    // console.log((new C2()).a)  // undefined
    // console.log((new C2().a))  // undefined
</script>
28
<script>
    // function test(a){
    //     this.a = a;
    // }
    // test.prototype.a = 20;
    // test.prototype.init = function(){
    //     console.warn(this.a)
    // }
    // var s = new test();
    // s.init(); //undefined
</script>
<script>
    // function C1(name) {
    //     if (name) this.name = name;
    // }
    // function C2(name) {
    //     this.name = name;
    // }
    // function C3(name) {
    //     this.name = name || 'fe';
    // }
    // C1.prototype.name = "aaa";
    // C2.prototype.name = "bbb";
    // C3.prototype.name = "ccc";
    // // aaaundefinedfe
    // console.log((new C1().name) + (new C2().name) + (new C3().name));
</script>
29
<script>
    var a;
    // 一个undefiend和字符串拼接得到的是字符串
    var str = a + "hello"
    console.log("............."+str)
    function A(name){
        this.name = name;
        console.log(this)
        console.log(this.name)  // undefined
        console.log(typeof this.name)  // undefined
    }
    new A();
</script>
        console.log(this.name)  // undefined
        console.log(typeof this.name)  // undefined
    }
    new A();
</script>