标签:html 个数 click interval 模式 批量创建 class str 并且
在函数中this指向谁: 函数中的this指向谁,是由函数被调用的那一刻就确定下来的
1 // 想要判断函数中的this指向谁,遵循两条原则:
2 // 1. 我们要判断的this在哪个函数中
3 // 2. 这个函数是哪种调用模式调用的
4
5 function fn(){
6 console.log(this);
7 }
8
9 // 普通函数调用: this --> window
10 fn();
11
12 //对象调用 this -->obj
13 var obj = {};
14 obj.f = fn;
15 obj.f(); //this -->obj
16
17 // new 调用函数 this --> 新创建出来的实例对象
18 var f = new fn();
19
20 // 注册事件 this --> box
21 box.onclick = fn;
22
23 // 定时器 this --> window
24 setInterval(fn,1000); //fn内部底层是被浏览器调用的所以也指window
1 function fn(x, y){
2 console.log(this);
3 console.log(x + y);
4 }
5
6 var f = fn.bind({a:1}); //fn中的this 永久绑定{a: 1} ;f是新克隆出来的函数
7 console.log(f); //输出 一个新的函数
8 /*
9 输出结果 ƒ fn(x, y){
10 console.log(this);
11 console.log(x + y);
12 }
13 */
14 f(1,2); // {a: 1} 3
案例
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 <meta http-equiv="X-UA-Compatible" content="ie=edge">
7 <title>Document</title>
8 </head>
9 <body>
10 <!-- 当我们需要批量创建对象的时候,需要用到构造函数,构造函数如何继承? -->
11 <!-- 借用构造函数法继承 -->
12 <!-- student里面的name age不想在重复的书写了 -->
13 <script>
14 function Person (name,age){//03 ‘zh‘,18
15 this.name=name; // a.name=‘zh‘
16 this.age=age; // a.age=18
17 }
18
19 function Student (name,age,score){//(‘zh‘,18,100)
20 Person.call(this,name,age);//02 this指向a, Person.call()调用了函数,并将参数‘zh‘,18传入
21 this.score=score;
22
23 }
24
25 var a=new Student(‘zh‘,18,100) //01 new Student()会调用Student构造函数,并且将构造函数中的this指向new出来的新对象a,
26 console.log(a) //还会把参数(‘zh‘,18,100)传入 构造函数中
27
28 // new的作用
29 // 创建一片空的储存空间
30 // 让子对象继承父对象
31 // 调用构造函数,并将构造函数中的this 指向new新对象
32 // 返回新对象的地址给变量
33
34
35 </script>
36 </body>
37 </html>
this的指向问题 call apply bind 中的this
标签:html 个数 click interval 模式 批量创建 class str 并且
原文地址:https://www.cnblogs.com/javascript9527/p/11386292.html