前端架构

//1、声明
//只读常量 const
//全局变量 var
//局部变量 let

//2、赋值
//2.1、按照对应位置，对变量赋值
let [a, b, c] = [1, 2, 3];
//2.2、Set 结构，也可以使用数组的解构赋值
let [x, y, z] = new Set(['a', 'b', 'c']);
//2.3、解构不仅可以用于数组，还可以用于对象
let { foo, bar } = { foo: 'aaa', bar: 'bbb' };

//3、对象拓展
const o = {
    method() {
        return "Hello!";
    }
};

//4、Set 它类似于数组，但是成员的值都是唯一
//4.1、Set本身是一个构造函数，用来生成 Set 数据结构
const s = new Set();
[2, 3, 5, 4, 5, 2, 2].forEach(x => s.add(x));
for (let i of s) {
    console.log(i);
}
// 2 3 5 4
//4.2、初始化
const set = new Set([1, 2, 3, 4, 4]);　　

function _f(o) {
    console.log("调用call:" + o);
}
class Ajax {
    constructor(host) {
        this.host = host;
    }
    get(api) {
        console.log(this.host + api);
    }
    func(o) {
        _f.call(this, o);
    }
}
//Object.assign 方法向类添加多个方法
Object.assign(Ajax.prototype, {
    post(api) {
        console.log(this.host + api);
    }
});

var ajax = new Ajax("http://microsoft-zh.com.cn");
ajax.get("/api/open/user.get");
ajax.post("/api/open/user.login");
ajax.func("调用");

class utils {
    //静态方法
    static print(x) {
        console.log(x);
    }

}
utils.print(1);

/*立即执行*/
//方式一
(function () {
    console.log('Welcome to the Internet.');
})();
//方法二
(() => {
    console.log('Welcome to the Internet.');
})();
//方法三
let func = new class {
    constructor(name) {
        this.name = name;
    }
    getName() {
        console.log(this.name);
    }
}("名字")
func.getName();


/*类继承*/
class util extends utils {
    constructor() {
        super();
    }
}
util.print(2);

 

//json2.js
if (typeof JSON !== 'object') {
JSON = {};
}
(function () {
"use strict";
var version = "1.1.0";
if (typeof JSON.stringify !== "function") {
JSON.stringify = function (value, replacer, space) {
}
}
if (typeof JSON.parse !== "function") {
JSON.parse = function (text, reviver) {
}
}
}());

//jQuery
(function (window, undefined) {
"use strict";
var version = "1.1.0";
var jQuery = function (selector, context) {

}
jQuery.fn = jQuery.prototype = {

}
window.jQuery = window.$ = jQuery;
})(window)

//vue.js
'use strict';
function Vue(options) {
this._init(options);
}
Vue.version = '1.1.0';
function initUse(Vue) {
Vue.use = function (plugin) {
}
return this
}
function initExtend(Vue) {
Vue.extend = function (extendOptions) {

}
return this
}
initUse(Vue);
initExtend(Vue);

//require.js
var require, define;
(function (global) {
var req;
req = function () { }
define = function (name, deps, callback) { }

req.version = "1.1.0";
req.config = function (config) { }
if (!require) {
require = req;
}

}(this));

//socket.io.js、redux.js
(function (root, factory) {
root["io"] = factory();
})(this, function () {
'use strict';
return (function (modules) {
function __webpack__(moduleId) {
return {};
}
return __webpack__(0);
})
});

//lodash.js
(function () {
function lodash(value) {
return value instanceof LodashWrapper
? value
: new LodashWrapper(value);
}
function LodashWrapper(value, chainAll) {
}
var version = "1.1.0";
}.call(this));

//react.js
(function () {
'use strict';
function useCallback(callback, inputs) {
}
var React = {
useCallback:useCallback
}
//冻结一个对象，防止对象被修改
var react = Object.freeze({
default: React
});
module.exports = react;
})();

//jquery.jplayer.js
(function (root, factory) {
factory(root.jQuery);
}(this, function ($, undefined) {
$.fn.jPlayer = function (options) {

}
$.jPlayer = function (options, element) {

}
})

//lib.js
(function (global, factory) {
global["lib"] = factory();
})(window, function () {
"use strict";
function lib() {

}
var libPrototype = lib.prototype;

return lib;
});

//webim.js
var webim = {
/* function login
*
* params
* info
* listeners
* options
* return
* (无)
*/
login: function (info, listeners, options) { },
/* function logout
*
* params
* cbOk
* cbErr
* return
* (无)
*/
logout: function (cbOk, cbErr) { }
}

(function (webim) {
//第一步：声明全局常量

//第二步：创建工具类

//第三步：声明对象 => 实现对象

//sdk版本
const sdk = {
version: '1.7.2',
appid: '537048168',
plaatform: "10"
};

//后台接口主机
const srvhost = {
formal: {
common: 'https://webim.tim.qq.com',
pic: 'https://pic.tim.qq.com'
}
};

var tool = new function () {
//格式化时间戳
this.formatTimeStamp = function (timestamp, format) { };
//将空格和换行符转换成HTML标签
this.formatText2Html = function (text) { };
//将HTML标签转换成空格和换行符
this.formatHtml2Text = function (html) { };
//判断浏览器版本
this.getBrowserInfo = function () { };
};
//日志对象
var log = new function () {

};
//发起ajax请求
var ajaxPost = function (meth, url, req, timeout, content_type, isLongPolling, cbOk, cbErr) {
};
var ajaxGet = function (meth, url, req, timeout, content_type, isLongPolling, cbOk, cbErr) {
};
//上传文件
var uploader = new function () { };

webim.tool = tool;
webim.log = log;
webim.login = webim.init = function (info, listeners, opts) { };
webim.logout = webim.offline = function (cbOk, cbErr) { };
}(webim));