YUI 之yui.js

fsy0718 2021-08-03 原文

一、构造函数直接返回一个对象，避免调用时出错。

Function Fvar F = function () {
  var f = this;
  instanceOf = function (o, type){
    return (o && o.hasOwnProperty && (o instanceof type));
  };
  if(!(instanceOf(f, F))){
    f = new F();
  }
  f.say = function(){
    console.log(\'instance\');
  };
  f.instanceOf = instanceOf;
  return f;
};

二、充分利用YUI是一个全局的变量，也是一个全局的对象，可以在YUI上存放很多属性及方法。YUI的很多全局属性及方法都是利用YUI.Env这一个对象来进行中转的

Function F(function(){
  proto = {
    speak: function(){
      console.log(\'this is speak from prototype\');
    },
    age: 26,
    _init: function() {
      var f = this,G_Env = F.Env, Env = f.Env;
      if(!Env){
        f.Env = {
          sex: \'man\',
          work: \'web worker\',
          love: \'lhy\'
        }
      }
      f.version = \'0.0.1\';
      Env = f.Env;
      f.Env.fsy = function(){
        console.log(\'some message\');
      }
    }
  };
  F.prototype = proto;
  for(prop in proto){
    if(proto.hasOwnProperty(prop)){
      F[prop] = proto[prop]
    }
  }
  F._init();
}());

三、充分利用this指向进行操作，比如YUI的对象配置分为YUI.GlobalConfig(全局配置），YUI_config(页面配置),YUI()（调用时传入参数的实例配置）三部分，就在原型中定义了一个applyConfig方法，从而通过不同的调用来进行配置。

四、一个yui.js在页面上第一次被引用后的执行顺序是

检测全局对象YUI是否存在 —-> 定义YUI构造函数 —> 自执行函数；

在自执行函数时，会进行以下几步

定义私有变量及方法 —-> 给html加类名 —> 定义一个包含一系列方法及属性的对象proto —> 将YUI对原型指向对象proto —-> 将proto中的方法及属性显示的赋给YUI，从而可以配置YUI —–> 给YUI重定义一个配置参数的方法(先配置全局的、再配置传入的、再将全局参数重置） —> 调用YUI._init()来初始化运行环境 –—> 监听window.load —> 将事件监听及注销函数赋给YUI.Env —> 在YUI.Env上为版本VERSION开辟一个空间，便于进行版本hash对象，

运行完毕以后，一个YUI会有以下属性及方法

applyConfig,_config,_init,_setup,applyTo,add,_attach,_delayCallback,use,_notify,_use,namespace,log,message,dump,error,guid,stamp,destroy,version,Env,_yuid,id,constructor,config

初始化环境函数执行步骤

定义YUI的版本号 —–> 配置环境 ——-> 配置YUI的ID ——> 创建css标记元素 ——-> 增加默认配置的语言 ——–> 增加默认配置路径

配置完毕的环境为

core,loaderExtras,mods,versions,base,cdn,_idx,_used,_attached,_missed,_yidx,_uidx,_guidp,_loaded,_BASE_RE,parseBasePath,getBase,cssStampEl,add,remove,3.12.0,