mootools 类型函数

2024-01-12

所以我试图通过学习 Mootools 内部的工作原理来学习 javascript。我正在具体查看这些行:

var Type = this.Type = function(name, object){
    if (name){
        var lower = name.toLowerCase();
        var typeCheck = function(item){
            return (typeOf(item) == lower);
        };

        Type['is' + name] = typeCheck;
        if (object != null){
            object.prototype.$family = (function(){
                return lower;
            }).hide();

        }
    }

    if (object == null) return null;

    object.extend(this);
    object.$constructor = Type;
    object.prototype.$constructor = object;

    return object;
};

//some more code

new Type('Type',Type);

这里发生了什么?

在底部的构造函数语句中分配给全局窗口对象的对象是什么?

当 Type 函数似乎只更新传入的对象而不是创建一个新对象时,为什么要使用 new 语句将其作为构造函数调用?

具体来说,object.extend(this); 行中的“this”是什么? ?它是全局窗口对象吗?如果是,它是否将该对象的所有键、值对添加到 Type 对象中?


天哪,最近的问题似乎更多地集中在 mootools 内部。

我将尽我所知回答,因为我不是核心开发人员。

TypeMooTools 中的类与 Class 非常相似(事实上,类构造函数本身就是一个类型 https://github.com/mootools/mootools-core/blob/master/Source/Class/Class.js#L19)但它更关注数据/值和值的类型。它还旨在扩展 ECMA 规范定义的本机类型并使它们更加灵活。

我想一般讨论数据类型是没有意义的(String, Number, Array, Object, ETC)。为什么需要延长它们?好吧,对于初学者来说,管道类型在 js 中有点古怪。typeof {}; // object, typeof []; // object, typeof new Date(); // object等等 - 不是最有帮助的,即使因为所有类型都继承自 object 并且将它们组合在一起是合乎逻辑的,但它不会帮助您编写代码。

因此,在 js 对象的上下文中,它们是从构造函数对象创建的......

Type 所做的并不是替换构造函数,而是通过向现有构造函数添加新方法或属性来更改现有构造函数。

eg. new Type('Array', Array);

这会将本机 Array 构造函数转换为某种类型对象。您不需要保存结果或任何内容 - 这是一个一次性操作,可以修改原始结果并使其开放以供操作。

typeOf(Array); // type

那么,有什么不同呢?嗯,对于初学者来说,typeOf([])现在能够真正告诉我们它到底是什么 -array。这里真正发生的事情是这样的:object.extend(Type);,神奇的一点。它将把 Type 对象上定义的所有属性复制到目标对象 - 您可以在这里看到它们:

https://github.com/mootools/mootools-core/blob/master/Source/Core/Core.js#L211-232 https://github.com/mootools/mootools-core/blob/master/Source/Core/Core.js#L211-232

因此,您新创建的类型立即获得所有重要的信息implement and extend方法。

更高级的是,让我们创建一个基于本机 Array 构造函数的新类型:

var foo = new Type('foo', Array),
    a = new foo();
// it's a real boy!
a.push('hi');
// ['hi'], foo, object
console.log(a, typeOf(a), typeof a);

但是,如果我们想要自定义类型怎么办?一个神奇而特别的东西?没问题,因为参数 2 实际上可以是一个(匿名)函数。

var Awesome = new Type('awesome', function(name, surname) {
    // console.log('I R teh construct0r!'); 
    this.name = name;
    this.surname = surname;
});

// extend it a little.
Awesome.implement({
    getName: function() {
        return this.name;
    },
    getSurname: function() {
        return this.surname;
    }
});

var Dimitar = new Awesome('dimitar', 'christoff');
console.log(typeOf(Dimitar)); // awesome
console.log(Dimitar.getName()); // dimitar

在另一个例子中,看看 DOMEvent。它采用上述内容并将其变成更快、更精简的对象类型。https://github.com/mootools/mootools-core/blob/master/Source/Types/DOMEvent.js#L21 https://github.com/mootools/mootools-core/blob/master/Source/Types/DOMEvent.js#L21

那么为什么这不是一个类呢?因为,课程更贵,而且活动一直在发生。

我希望这对您有所帮助。要获得更详细的解释,请在邮件列表上询问并希望得到最好的结果,也许核心开发人员会有时间,因为这不是标准的“我如何让手风琴工作”类型的问题......

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

mootools 类型函数 的相关文章

  • ReferenceError:regeneratorRuntime未定义(但在范围内工作)

    我遇到过这种奇怪的情况 ReferenceError regeneratorRuntime is not defined 我已经设法在一个非常小的设置中重现 与同一问题上的类似问题相比 并且还注意到一些奇怪的行为 具体取决于是否使用范围 以
  • Chart.js 在初始化时设置活动段

    我正在使用 Chart js v2 并且尝试在加载图表时模拟圆环图上某个段的 悬停状态 因此看起来有一个部分已突出显示 我已经搜索和梳理了代码一天 但找不到一个好的方法来做到这一点 提前致谢 设置片段的悬停样式有点令人困惑 因为它没有真正记
  • 为什么我的淘汰单选按钮在另一个具有点击绑定的元素内时会失败?

    我有一个单选按钮列表 我想要点击 li 他们还检查单选按钮 这一切都有效 直到我放了一个name单选元素上的属性 然后我的代码停止工作 我的代码如下所示 ul li li ul li
  • 以编程方式填写reactjs表单

    我正在编写一个用户脚本 但无法填写由reactjs制作的表单 我的代码 document querySelector id username value email protected cdn cgi l email protection
  • 如何修改每个JSON对象javascript

    我想修改里面的每个 JSON 值cooldown object cooldown user 1 This user2 0 This 在 Javascript 中使用 for 语句 我研究了好几个小时 只找到了内部的 blocks Edit
  • 如何使用javascript将大图像转换为十六进制?

    如果我尝试将图像转换为十六进制 无论我使用哪个函数 我都会收到此错误消息 该图像的大小为 7 MB 19812 毫秒 清理 1401 2 1455 0 gt 1401 2 1455 0 MB 9 9 0 ms 自上次 GC 以来 8 3 m
  • 隐藏 Div 的父级

    我只是想隐藏父divcomments section div class content content green div div div 我试过这个 document getElementById comments section pa
  • 防止 iOS 键盘在 cordova 3.5 中滚动页面

    我正在使用 Cordova 3 5 和 jQuery mobile 构建 iOS 应用程序 我在大部分应用程序中禁用了滚动功能 但是 当我选择输入字段时 iOS 键盘会打开并向上滚动页面 我不想要这个功能 由于输入足够高 键盘不会覆盖它 我
  • 尝试将数据存储在点击器网站中

    我正在尝试存储一个名为的变量score无论何时刷新 您都会一次又一次地使用它 我不明白的是它的代码是什么 我尝试了一些方法 但似乎都不起作用 这是我的答题器网站 但是当我尝试使用 JavaScript 来存储它时 它不起作用window o
  • 使用 CSS 或 Javascript 填充动画

    我只是想知道是否可以使用 CSS 或 javascript 创建填充动画 基本上我想创建一个填充动画 如下图所示 http i40 tinypic com eit6ia png http i40 tinypic com eit6ia png
  • 在 HTML5 画布中,如何用我选择的背景遮盖图像?

    我试图用画布来实现这一点 globalCompositeOperation 但没有运气 所以我在这里问 这里有类似的问题 但我没有在其中找到我的案例 我的画布区域中有图层 从下到上的绘制顺序 画布底座填充纯白色 fff 用fillRect
  • Javascript split 不是一个函数

    嘿朋友们 我正在使用 javascript sdk 通过 jQuery facebook 多朋友选择器在用户朋友墙上发布信息 但是我收到此错误friendId split 不是函数 这是我的代码 function recommendToFr
  • window.location 和 location.href 之间的区别

    我对之间的区别感到困惑window location and location href 两者似乎都以相同的方式行事 有什么不同 window location是一个对象 它保存有关当前文档位置的所有信息 主机 href 端口 协议等 lo
  • 为什么我们在打字稿中使用 HTMLInputElement ?

    我们为什么使用 document getElementById ipv as HTMLInputElement value 代替 document getElementById ipv value 功能getElementById返回具有类
  • 可以设置标题样式吗? (并且使用CSS或js?)[重复]

    这个问题在这里已经有答案了 我想知道是否可以设计一个title a href title This is a title Hello a 样式问题有两个方面 文本格式 编码 我猜这是可能的 所以在问题中这样做 工具提示样式 你能把它弄大一点
  • 在移动设备上滚动

    这个问题更多的是一个建议研究 我确实希望它对其他人有帮助 并且它不会关闭 因为我不太确定在哪里寻求有关此事的建议 在过去的 6 个月里 我一直在进行移动开发 我有机会处理各种设备上的各种情况和错误 最麻烦的是滚动问题 当涉及到在网站的多个区
  • 日期出现奇怪的错误,“未捕获非法访问”

    所以我试图找到最新的DateJavascript 可以处理 我把它减少到 9 月 275760 并增加了我开始捕获未捕获的天数illegal access例外new Date 09 24 275760 to new Date 10 13 2
  • Three.js 各种大小的粒子

    我是 Three js 的新手 正在尝试找出添加 1000 个粒子的最佳方法 每个粒子都有不同的大小和颜色 每个粒子的纹理是通过绘制画布创建的 通过使用粒子系统 所有粒子都具有相同的颜色和大小 为每个粒子创建一个粒子系统是非常低效的 有没有
  • 使用 MongoDB 和 Nodejs 插入和查询日期

    我需要一些帮助在 mongodb 和 nodejs 中按日期查找记录 我将日期添加到抓取脚本中的 json 对象 如下所示 jsonObj last updated new Date 该对象被插入到 mongodb 中 我可以看到如下 la
  • Vue.js[vuex] 如何从突变中调度?

    我有一个要应用于 json 对象的过滤器列表 我的突变看起来像这样 const mutations setStars state payload state stars payload this dispatch filter setRev

随机推荐