<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>

<script type="text/javascript">
    //this的四种调用模式(this作用域)  //在此声明,this仅仅是一个作用域的关键字,为了区分变量的作用域。(构造器调用模式)  
    /**
     * 方法调用模式
     * 当一个函数被保存为对象的一个属性时,我们称它为一个方法,当方法被调用时,this指向该对象
     * @type {{value: number, getValue: getValue}}
     */
    var obj = {
        value : 'getValue() in Object',
        getValue : function() {
            alert(this.value);
        }
    };
    obj.getValue();     //alert 1

    /**
     * 函数调用模式
     * 当一个函数并非一个对象的属性时,它被当做一个函数来调用,此时的this指向全局变量(window)
     * @type {string}
     */
    window.value = 'getValue() not in Object';
    function getValue() {
        alert(this.value);
    }
    getValue();

    /**
     * 构造器调用模式
     * 结合new前缀调用的函数被称为构造器函数,此时的this指向构造器函数的实例对象
     * @param val
     */
    function show(val){
        this.value = val;
        //value = val;
    }
    show.prototype.getVal = function() {
        alert(this.value);
        //alert(value); show()方法中省略this,此处省略this可以显示正常结果。原因:变量提升。
    };
    var func = new show('constructor');
    func.getVal();

    /**
     * apply/call调用模式,对象冒充
     *
     * @param str
     */
    var fun = function(str) {
        this.stauts = str;
    };
    fun.prototype.getStatus = function () {
        alert(this.status);
    };
    var obj  = {
       status : 'loading'
    };
    fun.prototype.getStatus.apply(obj);    //相当于 fun.prototype.getStatus.apply(obj, null); 
</script> </head> <body> </body> </html>

js中this的四种调用模式的更多相关文章

  1. JS面向对象函数的四种调用模式

    函数的四种调用模式 概念 在 js 中,无论是函数, 还是方法, 还是事件, 还是构造器,...这些东西的本质都是函数 函数, 方法, 事件, 构造器,...只是所处的位置不同 这四种模式分别是 函数 ...

  2. javascript中函数的四种调用模式详解

    介绍函数四种调用模式前,我们先来了解一下函数和方法的概念,其实函数和方法本质是一样,就是称呼不一样而已.函数:如果一个函数与任何对象关系,就称该函数为函数.方法:如果一个函数作为一个对象属性存在,我们 ...

  3. js高级-函数的四种调用模式

    1.对象方法调用模式  方法内部的this指向当前调用者的对象d 定义类 (构造函数) function Dog (dogName){ //创建一个空对象   让空对象==this this.name ...

  4. js中this的四种使用方法

    0x00:js中this的四种调用模式 1,方法调用模式 2,函数调用模式 3,构造器调用模式 4,apply.call.bind调用模式 0x01:第一种:方法调用模式 (也就是用.调用的)this ...

  5. JavaScript (JS) 函数补充 (含arguments、eval()、四种调用模式)

    1. 程序异常 ① try-catch语法    测试异常 try-catch语法代码如下: try { 异常代码;     try中可以承重异常代码, console.log(“try”)  出现异 ...

  6. 【转】JavaScript中的this关键字使用的四种调用模式

    http://blog.csdn.net/itpinpai/article/details/51004266 this关键字本意:这个.这里的意思.在JavaScript中是指每一个方法或函数都会有一 ...

  7. 函数的四种调用模式.上下文调用.call.apply

    闭包:函数就是一个闭包,一个封闭的作用域;         返回函数,要返回多个函数就用一个对象封装一下,         立即执行函数+return 回调函数   JS动态创建的DOM,不会被搜索引 ...

  8. 【温故知新】——原生js中常用的四种循环方式

    一.引言 本文主要是利用一个例子,讲一下原生js中常用的四种循环方式的使用与区别: 实现效果: 在网页中弹出框输入0   网页输出“欢迎下次光临” 在网页中弹出框输入1   网页输出“查询中……” 在 ...

  9. Android中Activity的四种启动模式

    要了解Android的启动模式先要了解一下Activity的管理方式: 1.Activity的管理机制 Android的管理主要是通过Activity栈来进行的.当一个Activity启动时,系统根据 ...

随机推荐

  1. angular学习资源

    angular学习资源   angularjs库: https://developers.google.com/speed/libraries/devguide?hl=zh-CN#angularjs ...

  2. PropertyPlaceholderConfigurer的用法:

    用法1: <?xml version="1.0" encoding="UTF-8"?> <beans xmlns="http://w ...

  3. SSTable and Log Structured Storage: LevelDB

    If Protocol Buffers is the lingua franca of individual data record at Google, then the Sorted String ...

  4. 【原创】从零开始学SpagoBI5.X源码汉化编译

    从零开始学SpagoBI5.X源码汉化编译 一.新建Tomact Server 服务器并配置测试1.文件-新建-其他-过滤server-服务类型选择Tomact V7.0 Server2.根据需要修改 ...

  5. PyCharm 134 单元测试输出大量空行解决方案

    在某次BugFix中,某哥们儿在/helper/pycharm/tcunittest.py加了个这: 各位亲们可以把True改为False即可解决大量空行的问题.

  6. HBase - Phoenix剖析

    1.概述 在<Hadoop-Drill深度剖析>一文当中,给大家介绍了Drill的相关内容,就实时查询来说,Drill基本能够满足要求,同时还可以做一个简单业务上的聚合,如果在使用Hive ...

  7. 【原】 COCOS2D—LUA 获取剪贴板内容

    android下: local luaj = require ("framework.luaj")   local ok,ret  = luaj.callStaticMethod( ...

  8. [AX2012]Claims user

    AX2012可以创建一种account type为claims user的账号,这种账号不需要在AD中事先已创建用户,但是claims账号是无法通过rich client登陆到AX,它的主要应用场景是 ...

  9. StringEx

    static class StringEx { public static string MD5(this String str) { byte[] bytes = new MD5CryptoServ ...

  10. Visual Studio 2015 开发大量 JavaScript 代码项目程序崩溃的解决方案

    最近公司做新项目,基于 Bootstrap.AngularJS 和 kendo 开发一套后台的管理系统,在项目中使用了大量的 JavaScript 文件,这两天 Visual Studio 2015 ...