javascript - JS对象实例化的时候,event做了什么?
大家讲道理
大家讲道理 2017-04-11 13:30:09
[JavaScript讨论组]

JS对象实例化的时候,event做了什么?

之前使用对象都是这样:

//构造函数
function Test(foo){
  this.foo = foo;
  alert(this.foo);
}
//实例化
var ale = new Test("Holle!");//传入foo实参

然后发现构造函数可以不使用形参,而用event对象直接调用

//构造函数,不使用形参
function Test2(e){
  this.foo = e.foo;
  alert(this.foo);
}
//实例化
var ale2 = new Test2({foo: "Hello Again!"});

event对象代表事件状态,但是实例化对象时event具体做了什么?有点转不过来
还可以再简化一下。。我只要知道event做了什么

//构造函数,不使用形参
function Test3(e){
  alert(e.foo);
}
//实例化
var ale3 = new Test3({foo: "Hello Again2!"});
大家讲道理
大家讲道理

光阴似箭催人老,日月如移越少年。

全部回复(7)
高洛峰

看到这是两天前的邀请,不过既然没有满意答案,我来解释下你遇到了什么样的问题

首先,你定义了一个带有一个参数的构造函数

function Test(foo) {
    // ......
}

这个构造函数定义为需要一个参数,内部会对这个参数进行处理。同时,你希望这个参数是一个字符串(姑且这么猜想),这样通过 this.foo = foo 可以给字段 foo 赋予一个字符串值。然而,问题出现了

JavaScript 的变量是不指定类型的,参数也是一样。你希望的类型并不一定是用户(指调用者)构造的时候传入的类型。你这里希望用户传入字符串,但实际用户传入了一个对象,甚至也有可能是一个数组,或者函数,总之,你根本不能确定用户输入什么,就像这些:


// 传入对象
new Test({ name: "hello" });

// 传入数组
new Test([1, 2, 3, 4, 5]);

// 传入函数
new Test(function() {
    console.log("hello world");
});

// 啥都不传入
new Test();

既然不能确定用户会传入啥,那现在有两个方案

  1. 文档中清楚的说明需要传入字符串参数,实际处理的时候把参数当成是字符串值处理

  2. 检查用户传入的参数是什么,分别进行处理

第一种方案容错极差,所以不讨论它。我们来说说第二种方案。

对于可以想像的一些情况,进行处理,比如

function Test(foo) {
    switch (typeof foo) {
        case "string":
            // 如果传入的 foo 是个字符串,符合预期
            this.foo = foo;
            break;
        case "function":
            // 如果传入的 foo 是个函数,取其运算结构
            this.foo = foo();
            break;
        case "object":
            // 如果是个对象(注意,有可能是 null)
            // 取其 foo 值,没有则用默认值代替
            this.foo = (foo || {}).foo || "";
            break;
        default:
            // 其它情况用默认值代替
            this.foo = "";
            break;  // 这个 break 可以不要,我按 C# 习惯写的
    }
}

这个容错性就比较好了,但是仍然会有一些漏洞,比如 typeof foo === "function" 的时候,取其结果,但其结果的类型仍然是不确定的。如何处理这个问题你可以参照着自己想办法了,一般不需要搞得太复杂,结合文档加部分容错就可以处理绝大多数的情况

天蓬老师

你到底在问什么?参数传进去就传进去了,这和event有一毛钱关系?
而且,你都引用e.foo了,这叫没使用形参?

怪我咯

这里的e是参数不是event对象吧?新手表示就看传进去了一个json格式的参数而已。

伊谢尔伦

我觉得你这个e就是一个表示对象的参数,不是event对象

PHP中文网

你转不过来是因为完全不知道event是个什么东西!
你实例化传参是一个object,不管构造函数的形参是什么都可以调用,例如

function test(data){
    alert(data.foo);
}

你的形参是e,这个e和事件对象没有一毛钱的关系!

说说事件对象,是发生某个事件,比如click事件才会产生事件对象

document.getElementById('id').onclick(function(e){
    var event = e||window.event;
    //当这个点击动作发生时,这才焦作event对象
});
巴扎黑
// 这个地方你认为 e 等价于 事件里面的 event 是吧??
// 然而这是错误的!
// 要想这里的 e 等价于 event
// 你需要将其和 事件绑定在一起,且不能传入任何参数才行(Test2.bind(obj)这种是允许的
// 不过不能:Test2.bind(obj , args)这样,因为带了参数 args
// 不懂的话,可以百度谷歌 js bind 方法)...
// 你自己的源码:
function Test2(e){
  this.foo = e.foo;
  alert(this.foo);
}
//实例化
var ale2 = new Test2({foo: "Hello Again!"});
----------------------------分割线-------------------------------
// 让 function Test2(e){...} 里面的 e 等价于 event 需要这样做
window.onload = Test2;
function Test2(e) {
  console.log('我是事件对象:' , e);
}

伊谢尔伦

这里面哪有event。。。。。

热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号