模拟 react 框架编码

清疚 2022-07-24 08:28 159阅读 0赞

**前端 React 源码，真是无语，不得不说FaceBook写的就是牛逼，JS的逻辑特别的清晰，耦合性特别的强。**

感觉 React 不错，所以就看了看源码，没事儿就模拟了下，代码附上：

<!DOCTYPE html>
    <html>
    
        <head>
            <meta charset="UTF-8">
            <meta content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no" name="viewport">
            <title></title>
        </head>
    
        <body>
            yubai
        </body>
        <script src="../../build/jquery.min.js"></script>
        <script src="man.js"></script>
        <script> console.log(React); console.log(React.render); React.render.search(); </script>
    
    </html>

**main.js文件**

(function(f){ if (typeof exports === "object" && typeof module !== "undefined") { module.exports = f() } else if (typeof define === "function" && define.amd) { define([], f) } else { var g; if (typeof window !== "undefined") { g = window } else if (typeof global !== "undefined") { g = global } else if (typeof self !== "undefined") { g = self } else { g = this } g.React = f() } })(function(){ return (function e(t, n, r) { function s(o, u) { if (!n[o]) { if (!t[o]) { var a = typeof require == "function" && require; if (!u && a) return a(o, !0); if (i) return i(o, !0); var f = new Error("Cannot find module '" + o + "'"); throw f.code = "MODULE_NOT_FOUND", f } var l = n[o] = { exports: {} }; t[o][0].call(l.exports, function(e) { var n = t[o][1][e]; return s(n ? n : e) }, l, l.exports, e, t, n, r) } return n[o].exports } var i = typeof require == "function" && require; for (var o = 0; o < r.length; o++) s(r[o]); return s })({ 1: [function(_dereq_, module, exports){ 'use strict'; var assign = _dereq_(2); var React = { render: assign, }; module.exports = React; }, { "2": 2, "3":3 }], 2:[function(_dereq_, module, exports){ console.log("222222222222222222222222222"); var strSub = { search:function(){ console.log("这里是数组1的 search()方法") }, searchName:function(){ console.log("这里是数组1的 searchName()方法") } }; module.exports = strSub; }, {}] }, {}, [1])(1) });

发表评论取消回复

表情：

评论列表（有 0 条评论，159人围观）

还没有评论，来说两句吧...

相关阅读

相关 React 框架

1、React 框架简介 1.1、介绍 CS 与 BS结合：像 React，Vue 此类框架，转移了部分服务器的功能到客户端。将CS 和 BS 加以结合。客户端只用

超、凢脫俗/ 2024年02月21日 10:53/ 0 赞/ 65 阅读

相关模拟编码过滤器

package com.example.demo.filter; import javax.servlet.; import java.io.

清疚/ 2024年02月18日 16:56/ 0 赞/ 20 阅读

相关 React使用useEffect模拟生命周期

一、useEffect是什么？副作用钩子：用于处理组件中的副作用，用来取代生命周期函数。 useEffect(()=>{//副作用函数 ret

落日映苍穹つ/ 2023年10月07日 22:50/ 0 赞/ 18 阅读

相关 REACT_react使用antd-mobile UI框架

安装 > npm install antd-mobile --save public/index.html <script src="https://as.ali

怼烎@/ 2022年10月11日 01:08/ 0 赞/ 232 阅读

相关模拟 react 框架编码

前端 React 源码，真是无语，不得不说FaceBook写的就是牛逼，JS的逻辑特别的清晰，耦合性特别的强。感觉 React 不错，所以就看了看源码，没事儿就模拟了下，代

清疚/ 2022年07月24日 08:28/ 0 赞/ 160 阅读

相关模拟Quintus引擎框架编码

最近看了Quintus引擎，感觉他的JS 架构做的不错，所以就自己模拟了一套。其实，效果的话，没有效果，比较枯燥，但是他的JS de 格式写的着实不错，继承，重写一一用到，

古城微笑少年丶/ 2022年07月24日 08:24/ 0 赞/ 128 阅读

相关模拟mui框架编码

//调用方法 / 1、tm.os.ios/tm.os.android/tm.os.versions().webKit //表示安卓设备/ios设备/webKit

以你之姓@/ 2022年07月18日 05:11/ 0 赞/ 227 阅读

相关 React 前端框架环境

1. 安装nodejs (node-v8.11.1-x64.msi) 2. 进入cmd指定前端工程目录 ![70][] 3. 安装node\_

悠悠/ 2022年05月21日 02:42/ 0 赞/ 239 阅读

相关 React UI框架

1、[Ant Design][] `antd` 是基于 Ant Design 设计体系的 React UI 组件库，主要用于研发企业级中后台产品。

绝地灬酷狼/ 2022年01月07日 02:53/ 0 赞/ 303 阅读

相关 React框架介绍

Virtual DOM 虚拟DOM是React的基石。之所以引入虚拟DOM，一方面是性能的考虑。Web应用和网站不同，一个Web应用中通常会在单页内有大量的D

缺乏、安全感/ 2021年09月17日 00:24/ 0 赞/ 421 阅读