1.this是javascript中的一个关键字,它代表函数运行时,自动生成的一个内部对象,只能在函数内部使用。 2.随着函数使用场合的不同,this的值会发生变化,但是有一个原则,就是this指的是调用函数的那个对象。 3.this分类 1)纯粹的函数调用 这时的this指向window。(函数没有所属对象:指向全局对象) eg: var x=1; function test(){ alert(this.x); } test();

 2)作为对象方法的调用 这时的this指向上级对象。(函数有所属对象时:指向所属对象) eg: function test(){ alert(this.x) } var o={}; o.x=1; o.m=test; o.m(); 3)作为构造函数调用 构造函数,就是通过这个函数生成一个新对象。这时的this指向这个新对象。(构造器中的 this:指向新对象) eg: function test(){ this.x=1; } var o=new test(); alert(o.x);

 var x=2; function test(){ this.x=1; } var o=new test(); alert(x);

 function foo(){return this.a}; var a=2; var o={a:3,foo:foo}; var p={a:4}; console.log(o.foo()); p.foo=o.foo; console.log(p.foo()); console.log(foo());

 4)apply或者call的调用 是改变函数对象的一个方法,作用是改变函数的调用对象。 eg: var x=0; function test(){ alert(this.x); } var o={}; o.x=1; o.m=test; o.m(); o.m.apply();

例题
//1 var point={     x:0,     y:0,     moveTo:function(x,y){         this.x=this.x+x;             this.y=this.y+y;             alert(this.x);    //1          alert(this.y);  //1     } } point.moveTo(1,1);

 //2    var myObject = {value: 100};    myObject.getValue = function () {        console.log(this.value);        console.log(this);        return this.value;    };    console.log(myObject.getValue());   // 100 object{value: 100} 100 

 //3    var myObject = {value: 100};    myObject.getValue = function () {        var foo = function () {            console.log(this.value);            console.log(this);        };        foo();        return this.value;    };    console.log(myObject.getValue());  //undefined window 100

 //4    var SomeClass = function(){        this.value = 100;    }    var myCreate = new SomeClass();    console.log(myCreate.value);     //100

 //5    var myObject = {value: 100};    var foo = function(){        console.log(this);    };    foo();          //window    foo.apply(myObject);  //object{value: 100}    foo.call(myObject);   //object{value: 100}

 //6var name = "clever coder";var person = {    name : "foocoder",    hello : function(sth){        var sayhello = function(sth) {            console.log(this.name + " says " + sth);        };        sayhello(sth);    }}person.hello("hello world");  //clever coder says hello world

 //7var name = "clever coder";var person = {    name : "foocoder",    hello : function(sth){        var that = this;        var sayhello = function(sth) {            console.log(that.name + " says " + sth);        };        sayhello(sth);    }}person.hello("hello world");  foocoder says hello world
//1 var point={     x:0,     y:0,     moveTo:function(x,y){         this.x=this.x+x;         this.y=this.y+y;         console.log(this.x);         console.log(this.y);     } }; point.moveTo(1,1);  //1 1
//2   var myObject = {value: 100};   myObject.getValue = function () {       console.log(this.value);       console.log(this);       return this.value;   };   console.log(myObject.getValue());  //100 object 100
//3   var myObject = {value: 100};   myObject.getValue = function () {       var foo = function () {           console.log(this.value);           console.log(this);       };       foo();       return this.value;   };   console.log(myObject.getValue());//undefined window 100
//4   var SomeClass = function(){       this.value = 100;   }   var myCreate = new SomeClass();   console.log(myCreate.value);  //100
//5   var myObject = {value: 100};   var foo = function(){       console.log(this);   };   foo();   //window   foo.apply(myObject);//Object   foo.call(myObject); //Object
 //6var name = "clever coder";var person = {    name : "foocoder",    hello : function(sth){        var sayhello = function(sth) {            console.log(this.name + " says " + sth);        };        sayhello(sth);    }}person.hello("hello world");  //clever coder says hello world
 //7var name = "clever coder";var person = {    name : "foocoder",    hello : function(sth){        var that = this;        var sayhello = function(sth) {            console.log(that.name + " says " + sth);        };        sayhello(sth);    }}person.hello("hello world");  //foocoder says hello world
//8var name="window";var Bob={    name:"Bob",    showName:function(){        alert(this.name);    }};var Tom={    name:"Tom",    showName:function(){        var fun=Bob.showName;        fun();    }}Tom.showName();  //window
//9var name="Bob";var nameObj={    name:"Tom",    showName:function(){        alert(this.name);    },    waitShowName:function(){        !function(__callback){            __callback();        }(this.showName);    }}nameObj.waitShowName(); //Bob
 var name="Bob"; var nameObj={     name:"Tom",     showName:function(){         alert(this.name);     },     waitShowName:function(){         var that=this;         setTimeout(function(){             that.showName();         },1000);     } };nameObj.waitShowName(); //Tom

转载于:https://www.cnblogs.com/l742314100/p/5933889.html

说出this的三个应用相关推荐

  1. 1. 变量提升 2. 条件语句 3. 循环语句 弹出框的三种形式 If条件的种类...

    1.     变量提升 变量提升是浏览器的一个功能,在运行js代码之前,浏览器会给js一个全局作用域叫window ,window分两个模块,一个叫内存模块,一个叫运行模块,内存模块找到当前作用域下的 ...

  2. [答疑]业务序列图推导出系统的三个用例注册SIM卡、申请激活、审核激活申请

    软件方法(下)分析和设计2021版本连载-第8章 分析类图(1)>> 勤瘦(216***56) 10:29:41 从业务序列图推导出系统的三个用例注册SIM卡.申请激活.审核激活申请 勤瘦 ...

  3. Layui弹出层的三项选择

    以Layu.msg()为例. layer.msg('大部分参数都是可以公用的<br>合理搭配,展示不一样的风格', {time: 20000, //20s后自动关闭btn: ['明白了', ...

  4. JS弹出对话框的三种方式

    javascript的三种对话框是通过调用window对象的三个方法alert(),confirm()和prompt()来获得,可以利用这些对话框来完成js的输入和输出,实现与用户能进行交互的js代码 ...

  5. 走出“搜索引擎营销”三个误区

    一说起搜索引擎营销(付费竞价排名),更多从业者会将其与排名.流量.甚至销量挂钩,孰不知,搜索引擎营销也与品牌息息相关. 1.搜索引擎营销三个误区 经过长时间的观察,发现众网站在搜索引擎营销方面有三个误 ...

  6. 老域名优化出新招,三点技巧来相助

    网站的SEO优化通常都是在网站建设完成之后就打下了优化的基础,但随着时代的发展和互联网搜索引擎算法的不断更新和升级,一些年龄较大的网站在进行老域名SEO优化时,会做出相应的网站调整,所以要跟随时代更新 ...

  7. 亚洲新首富出炉!富豪榜单大洗牌,马云3年来首次跌出中国前三

    3月2日,胡润研究院发布<2021胡润全球富豪榜>,上榜企业家财富计算截止日期为2021年1月15日.这是胡润研究院连续第十年发布"全球富豪榜". 2020年新冠肺炎疫 ...

  8. JavaScript实现弹出浏览器的三种提示框:提示信息框、确认框和输入文本框

    浏览器的三种提示框 1.alert()提示信息框 2.confirm()提示确认框 3.prompt()提示输入文本框 1.alert()提示信息框 效果图: 实现代码: <script> ...

  9. 分享:JavaScript弹出对话框的三种方式

    转载自品略图书馆 http://www.pinlue.com/article/2019/11/2023/069810461833.html 学习过js的小伙伴会发现,我们在一些实例中用到了alert( ...

  10. JavaScript弹出对话框的三种方法

    三种方法 alert(); 最简单,将alert();括号内的内容弹出. confirm(); 与alert();类似,包含确认和取消按钮,点击确定confirm();方法会返回true,点击取消co ...

最新文章

  1. 1057. Stack (30)
  2. flink 7-提交任务
  3. 在已安装win10环境中利用EasyBCD引导安装Ubuntu18.04(亲自测试,都是血和泪)
  4. Jzoj4891 摆书
  5. 语音对话平台海尔五代智能电视落地
  6. HALCON:如何结合面向对象和面向过程的代码
  7. day02.2-常用Linux命令整理
  8. OpenCV 人脸识别、图片相似度检测
  9. java执行maven命令
  10. excel如何把多张表合并成一个表_如何将多个 Excel 工作簿的工作表合并成一个工作表?...
  11. linux的lilo,深入Linux的LILO
  12. oracle公司的crm有哪些主要模块,Oracle CRM 的组成及各模块的功能
  13. 阅读笔记:Single Shot Multibox Detector(SSD)
  14. 红帽与Cloudera结成大数据联盟 释放企业级Hadoop潜能
  15. unix time stamp(时间戳)和常规时间相互转换的C++代码
  16. Fedora最新下载地址
  17. ctf ordinary keyboard的加密问题
  18. PLC编程入门梯形图实例讲解
  19. App Store 3月下载量下滑
  20. CentOS 安装Vim 编辑器

热门文章

  1. 我如何学习:不要停下学习的脚步
  2. swift -懒加载创建view
  3. Maven进行Mahout编程,使其兼容Hadoop2.2.0环境运行 (转)
  4. Exchange Server 2013部署系列之三:部署邮箱服务器角色
  5. php 一个URL加密解密的程序
  6. JDK 14 性能提升,但 JDK 8 仍是最强王者!
  7. Linux inode的正确理解
  8. 根据录入的计算公式计算_预制桩极限承载力标准值快速计算方法研究
  9. *第七周*数据结构实践项目一【建设环形队列算法库】
  10. 【2019/3/23】周进度报告