练习题4_this指向解答.html 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. <title>Document</title>
  7. </head>
  8. <body>
  9. <script>
  10. //1、写出下列输出结果
  11. // var x = 10;
  12. // function test() {
  13. // this.x = 20 // this指向window this.x = 20 window.x = 20
  14. // console.log(this.x)// 20
  15. // }
  16. // test()
  17. //2、写出下列输出结果
  18. // var name = "window"
  19. // var obj = {
  20. // name: "obj",
  21. // func1: function () {
  22. // console.log(this.name);// obj
  23. // (function () {
  24. // console.log(this.name)// window
  25. // })()
  26. // // function func2() {
  27. // // console.log(this.name);
  28. // // }
  29. // // func2();
  30. // }
  31. // }
  32. // obj.func1()
  33. //3、写出下列结果
  34. // var name = "the window";
  35. // var object = {
  36. // name: "My Object",
  37. // getName: function () {
  38. // return this.name;
  39. // }
  40. // }
  41. // console.log(object.getName());// My Object
  42. // console.log((object.getName)());// My Object
  43. // console.log((object.getName = object.getName)());// the window
  44. // (function(){
  45. // console.log(this)
  46. // })()
  47. // let a = 10;
  48. // if(b = a ){
  49. // console.log("true");
  50. // }else{
  51. // console.log("false");
  52. // }
  53. // var name = "the window"
  54. // let obj = {
  55. // name: "obj",
  56. // func1: function () {
  57. // console.log(this.name);
  58. // }
  59. // }
  60. // let fun2 = obj.func1;
  61. // fun2();
  62. //4、下列代码中当div的点击事件触发时输出的结果是?
  63. // document.getElementById("div").onclick = function () {
  64. // console.log(this)// div
  65. // };
  66. //5、请写出下列代码运行结果
  67. // var name = "window"
  68. // var obj = {
  69. // name: "obj"
  70. // }
  71. // window.setInterval(function () {
  72. // console.log(this.name)// window
  73. // }, 300)
  74. // window.setInterval(function () {
  75. // console.log(this.name)// obj
  76. // }.bind(obj), 300)
  77. // function foo(){
  78. // console.log("hello");
  79. // }
  80. // setInterval(foo,1000);
  81. //6、请补全下列代码
  82. // function foo() {
  83. // return function () {
  84. // console.log("hello world");
  85. // }
  86. // //补全此处代码实现每隔一秒输出 hello world
  87. // }
  88. // window.setInterval(foo(), 1000);
  89. // 7、补全下列代码实现 1+2+3+4
  90. // function add(c, d) {
  91. // return this.a + this.b + c + d;
  92. // }
  93. // var obj = {
  94. // a:1,
  95. // b:2
  96. // }
  97. // console.log(add.call(obj,3,4));
  98. // console.log(add.apply(obj,[3,4]));
  99. // let add2 = add.bind(obj,3,4);
  100. // console.log(add2());
  101. // var a = 1;
  102. // var b = 2;
  103. // console.log(add(3,4));
  104. // let a = 10;
  105. // console.log(this.a);
  106. //8、写出下列输出结果
  107. // function f() {
  108. // return this.a;
  109. // }
  110. // var g = f.bind({ a: "azerty" });
  111. // console.log(g());// azerty
  112. // // 如果对同一个函数使用多次bind 则以第一次绑定为准
  113. // var h = g.bind({ a: 'yoo' });
  114. // console.log(h());// azerty
  115. // var o = { a: 'loveCoding', f: f, g: g, h: h };
  116. // console.log(o.f(), o.g(), o.h());//loveCoding azerty azerty
  117. //9、补全下列代码
  118. var o = { prop: 'loveCoding'};
  119. function independent() {
  120. return this.prop;
  121. }
  122. // o.f = independent.bind(o);
  123. o.f = independent;
  124. //在此补全代码
  125. console.log(o.f()); // loveCoding
  126. </script>
  127. </body>
  128. </html>