上一主题 下一主题
ScriptCat,新一代的脚本管理器脚本站,与全世界分享你的用户脚本油猴脚本开发指南教程目录
返回列表 发新帖

Umd规范包的一些疑惑

[复制链接]
  • TA的每日心情
    开心
    昨天 01:19
  • 签到天数: 49 天

    [LV.5]常住居民I

    15

    主题

    79

    帖子

    162

    积分

    荣誉开发者

    Rank: 10Rank: 10Rank: 10

    积分
    162

    油中2周年新人报道荣誉开发者国庆纪念章

    发表于 2023-1-23 02:49:17 | 显示全部楼层 | 阅读模式
    5油猫币

    本帖最后由 bigonion 于 2023-1-23 04:49 编辑

    本帖最后由 bigonion 于 2023-1-23 03:42 编辑

    最近在把一些常用的函数写成模块

    问题篇

    以下是umd导出的时候实现的两个方式

    • CommonJs导出:
    (function () {
        'use strict';
        (function (c, x) {
            x(exports)  
        }
        )(this, function (c) {
            c.version = "v0.0.1"
        })
    }
    )();

    cjs调用

    const kit=require('./test.js')
    console.log(kit);

    可以正常使用输出kit对象

    疑惑:

    但是我就不是很看得懂这是啥意思:x(exports) 为什么这样就能够导出

    • 浏览器环境导出
    (function () {
        'use strict';
        (function (c, x) {
           (c = c || self, x(c.kit = {}))
        }
        )(this, function (c) {
            c.version = "v0.0.1"
        })
    }
    )();

    浏览器控制台直接输入即可看到kit已经被注册为全局变量

    疑惑:

    这里的写法 (c = c || self, x(c.kit = {})) 我也不是很看得明白,希望大佬们指条路

    解决篇

    感谢steven026
    和道哥的深夜帮助
    问题得到解决了
    这里如道哥所说

    function main(){
        const resiter=(obj,callback)=>{
             callback(obj) 
        }
        resiter(this,(c)=>c.version="v0.0.1")
    }
    main()

    以下把原文中的c都改成obj便于理解
    第一个:他把exports传入,exports是module.exports的别名
    相当于执行了exports.version="v0.0.1"
    exports是obj
    callback是function (obj) {
    obj.version = "v0.0.1"
    }

    第二个:
    (obj = obj || self, x(obj.kit = {}))
    这里可以写成正常的形式
    obj = obj || self
    x(obj.kit={})

    “由于是严格模式,所以this是undefined,c=self,而self在浏览器里指向window,所以obj=window ” ------steven026
    x(obj.kit={}) 可以理解为先开辟了一个kit对象,再把obj.kit作为参数传输回调函数中去执行
    之前看到传参一行是赋值就没看懂,其实就是一种简写的方式,一行做了两件事而已

    再次感谢steven026 && 道哥,新的一年,继续披荆斩棘!

  • TA的每日心情
    慵懒
    2 小时前
  • 签到天数: 231 天

    [LV.7]常住居民III

    15

    主题

    350

    帖子

    846

    积分

    荣誉开发者

    Rank: 10Rank: 10Rank: 10

    积分
    846

    新人进步奖荣誉开发者喜迎中秋油中2周年

    发表于 2023-1-23 03:05:58 | 显示全部楼层

    本帖最后由 steven026 于 2023-1-23 03:12 编辑

    就是2个自执行函数,
    第1个自执行函数未传参就是个闭包可以忽略

        (function (c, x) {
           (c = c || self, x(c.kit = {}))
        }
        )(this, function (c) {
            c.version = "v0.0.1"
        })

    第2个自执行传参了
    c=this || self
    x=function(c){c.version = "v0.0.1"}

    由于是严格模式,所以this是undefined,c=self,而self在浏览器里指向window,所以c=window
    又c.kit={},所以window.kit={},并且传一个window.kit作为x函数的参数,所以x函数中c.version="v0.0.1"就代表window.kit.version="v0.0.1"

    回复

    使用道具 举报

  • TA的每日心情
    开心
    昨天 23:59
  • 签到天数: 170 天

    [LV.7]常住居民III

    470

    主题

    4281

    帖子

    4322

    积分

    管理员

    非物质文化遗产社会摇传承人

    Rank: 10Rank: 10Rank: 10

    积分
    4322

    喜迎中秋国庆纪念章荣誉开发者管理员油中2周年

    发表于 2023-1-23 03:06:22 | 显示全部楼层
    (function () {
        'use strict';
        (function (c, x) {
            x(exports)  
        }
        )(this, function (c) {
            c.version = "v0.0.1"
        })
    }
    )();

    实际是IEFI函数,也就是自执行函数,拆开可以理解为

    function main(){
        cosnt resiter=(obj,callback)=>{
             callback(obj) 
        }
        resiter(this,(c)=>c.version="v.0.1")
    }
    main()

    this在commonjs特性会被当成module.exports
    在commonjs输入测试可以发现二者等价,相当于兼容了cjs标准
    至于浏览器同理,利用了this等价于window
    但是你贴的代码感觉不太对劲
    因为用了严格模式
    按严格模式来说this是为undefined的
    最好提供一个例子看看

    混的人。
    ------------------------------------------
    進撃!永遠の帝国の破壊虎---李恒道
    个人宣言:この世界で私に胜てる人とコードはまだ生まれていません。死ぬのが怖くなければ来てください。
    回复

    使用道具 举报

  • TA的每日心情
    开心
    昨天 23:59
  • 签到天数: 170 天

    [LV.7]常住居民III

    470

    主题

    4281

    帖子

    4322

    积分

    管理员

    非物质文化遗产社会摇传承人

    Rank: 10Rank: 10Rank: 10

    积分
    4322

    喜迎中秋国庆纪念章荣誉开发者管理员油中2周年

    发表于 2023-1-23 03:06:53 | 显示全部楼层
    steven026 发表于 2023-1-23 03:05
    [md]就是2个自执行函数,
    第1个自执行函数未传参就是个闭包可以忽略

    半夜不睡觉抢我答题!
    混的人。
    ------------------------------------------
    進撃!永遠の帝国の破壊虎---李恒道
    个人宣言:この世界で私に胜てる人とコードはまだ生まれていません。死ぬのが怖くなければ来てください。
    回复

    使用道具 举报

  • TA的每日心情
    慵懒
    2 小时前
  • 签到天数: 231 天

    [LV.7]常住居民III

    15

    主题

    350

    帖子

    846

    积分

    荣誉开发者

    Rank: 10Rank: 10Rank: 10

    积分
    846

    新人进步奖荣誉开发者喜迎中秋油中2周年

    发表于 2023-1-23 03:14:18 | 显示全部楼层
    李恒道 发表于 2023-1-23 03:06
    半夜不睡觉抢我答题!

    我下午开始玩文明6,玩着玩着就半夜了………………
    回复

    使用道具 举报

  • TA的每日心情
    开心
    昨天 01:19
  • 签到天数: 49 天

    [LV.5]常住居民I

    15

    主题

    79

    帖子

    162

    积分

    荣誉开发者

    Rank: 10Rank: 10Rank: 10

    积分
    162

    油中2周年新人报道荣誉开发者国庆纪念章

    发表于 2023-1-23 03:24:04 | 显示全部楼层
    李恒道 发表于 2023-1-23 03:06
    [md]```js
    (function () {
        'use strict';

    这么晚还在啊道哥,这个就是可执行的例子啊
    回复

    使用道具 举报

  • TA的每日心情
    开心
    昨天 01:19
  • 签到天数: 49 天

    [LV.5]常住居民I

    15

    主题

    79

    帖子

    162

    积分

    荣誉开发者

    Rank: 10Rank: 10Rank: 10

    积分
    162

    油中2周年新人报道荣誉开发者国庆纪念章

    发表于 2023-1-23 04:10:52 | 显示全部楼层

    本帖最后由 bigonion 于 2023-1-23 04:12 编辑

    就是2个自执行函数,
    第1个自执行函数未传参就是个闭包可以忽略

    [/quote]
    gg x(exports) 是/p>

    回复

    使用道具 举报

  • TA的每日心情
    开心
    昨天 01:19
  • 签到天数: 49 天

    [LV.5]常住居民I

    15

    主题

    79

    帖子

    162

    积分

    荣誉开发者

    Rank: 10Rank: 10Rank: 10

    积分
    162

    油中2周年新人报道荣誉开发者国庆纪念章

    发表于 2023-1-23 04:31:53 | 显示全部楼层
    steven026 发表于 2023-1-23 03:05
    [md]就是2个自执行函数,
    第1个自执行函数未传参就是个闭包可以忽略

    感谢gg ,已经理解了!
    回复

    使用道具 举报

  • TA的每日心情
    开心
    昨天 01:19
  • 签到天数: 49 天

    [LV.5]常住居民I

    15

    主题

    79

    帖子

    162

    积分

    荣誉开发者

    Rank: 10Rank: 10Rank: 10

    积分
    162

    油中2周年新人报道荣誉开发者国庆纪念章

    发表于 2023-1-23 04:50:12 | 显示全部楼层
    感谢steven026 && 道哥
    回复

    使用道具 举报

  • TA的每日心情
    开心
    昨天 23:59
  • 签到天数: 170 天

    [LV.7]常住居民III

    470

    主题

    4281

    帖子

    4322

    积分

    管理员

    非物质文化遗产社会摇传承人

    Rank: 10Rank: 10Rank: 10

    积分
    4322

    喜迎中秋国庆纪念章荣誉开发者管理员油中2周年

    发表于 2023-1-23 14:46:30 | 显示全部楼层
    bigonion 发表于 2023-1-23 04:50
    感谢steven026 && 道哥

    哥哥牛逼~
    混的人。
    ------------------------------------------
    進撃!永遠の帝国の破壊虎---李恒道
    个人宣言:この世界で私に胜てる人とコードはまだ生まれていません。死ぬのが怖くなければ来てください。
    回复

    使用道具 举报

    发表回复

    本版积分规则

    快速回复 返回顶部 返回列表