一:HTTP和HTTPS理解
1:HTTP協(xié)議通常承載在TCP協(xié)議之上 ,在HTTP和TCP之間添加一個安全協(xié)議層就變成了HTTPS
? ? ?HTTP:超文本傳輸協(xié)議 (HTTP-Hypertext transfer protocol) 是一種詳細(xì)規(guī)定了瀏覽器和服務(wù)器之間互相通信的規(guī)則
? ? ?HTTPS:是HTTP的安全版
2:默認(rèn)HTTP的端口號為80蜗细,HTTPS的端口號為443
3:HTTPS比HTTP更安全(原因):網(wǎng)絡(luò)請求需要中間有很多的服務(wù)器路由器的轉(zhuǎn)發(fā)锌订。中間的節(jié)點都可能篡改信息储狭,如果使用HTTPS,密鑰在客戶和終點站才有米愿。https之所以比http安全,是因為他利用ssl/tls協(xié)議傳輸梦鉴。保障了傳輸過程的安全性
二:對前端模塊化的理解
1:模塊化產(chǎn)生的背景:
? ? ? 在JavaScript發(fā)展初期就是為了實現(xiàn)簡單的頁面交互邏輯集绰,错妖;如今CPU、瀏覽器性能得到了極大的提升疚沐,很多頁面邏輯遷移到了客戶端(表單驗證等)暂氯,Ajax技術(shù)得到廣泛應(yīng)用,jQuery等前端庫層出不窮亮蛔,前端代碼日益膨脹而JavaScript卻沒有為組織代碼提供任何明顯幫助痴施,JavaScript極其簡單的代碼組織規(guī)范不足以駕馭如此龐大規(guī)模的代碼
2:模塊化前期發(fā)展的過程
? ? ?過程1:封裝函數(shù):實現(xiàn)特定的代碼段
? ? ? ? ? ? ? ?缺點:污染了全局變量 可能會與其他模塊發(fā)生變量名沖突 模塊間無聯(lián)系
? ? ?過程2:對象:把所有的模塊成員封裝在一個對象中(解決了封裝函數(shù)的缺點)
? ? ? ? ? ? ? ?缺點:外部可以隨意修改內(nèi)部成員
? ? ? 過程3:立即執(zhí)行函數(shù)
3:目前的模塊規(guī)范(Common.js ? AMD ?CMD)
? ? ? CommonJs(定義模塊:模塊名.js,模塊輸出:module.exports()究流,加載模塊:require辣吃,)
eg:----
var name = 'htt';
function a(){
console.log(name);
}
module.exports = {
a: a,
}
var nameModule = require('myModel.js');
nameModule.htt();
? ? ? AMD:(異步模塊定義,AMD 是 RequireJS 在推廣過程中對模塊定義的規(guī)范化的產(chǎn)出)
? ? ? ? (1)-- requireJS主要解決兩個問題:
? ? ? ? ? ? 多個js文件可能有依賴關(guān)系芬探,被依賴的文件需要早于依賴它的文件加載到瀏覽器
? ? ? ? ? ? ?js加載的時候瀏覽器會停止頁面渲染神得,加載文件越多,頁面失去響應(yīng)時間越長
? ? ? ?(2)--- 語法 :(定義模塊 ?加載模塊)
? ? ? ? ? ? 2-1:::::requireJS定義了一個函數(shù) define灯节,它是全局變量循头,用來定義模塊
? ? ? ? ? ? ?define(id?, dependencies?, factory);
? ? ? ? ? ? ?id:可選參數(shù),用來定義模塊的標(biāo)識炎疆,如果沒有提供該參數(shù)卡骂,腳本文件名(去掉拓展名)
? ? ? ? ? ? dependencies:是一個當(dāng)前模塊依賴的模塊名稱數(shù)組
? ? ? ? ? ?factory:工廠方法,模塊初始化要執(zhí)行的函數(shù)或?qū)ο笮稳搿H绻麨楹瘮?shù)全跨,它應(yīng)該只被執(zhí)行一次。如果是對象亿遂,此對象應(yīng)該為模塊的輸出值
? ? ? ? ? 2-2:::require函數(shù)加載模塊
? ? ? ? ? ? require([dependencies], function(){});
? ? ? ? ? ? require()函數(shù)接受兩個參數(shù)
? ? ? ? ? ? 第一個參數(shù)是一個數(shù)組浓若,表示所依賴的模塊
? ? ? ? ? ? 第二個參數(shù)是一個回調(diào)函數(shù),當(dāng)前面指定的模塊都加載成功后蛇数,它將被調(diào)用挪钓。加載的模塊會以參數(shù)形式傳入該函數(shù),從而在回調(diào)函數(shù)內(nèi)部就可以使用這些模塊
? ? ? ? ? ?require()函數(shù)在加載依賴的函數(shù)的時候是異步加載的耳舅,只有前面的模塊都加載成功后碌上,才會運(yùn)行,解決了依賴性的問題浦徊。
? ? ?(3)----eg:
定義模塊 myModule.js
define(['dependency'], function(){
var name = 'htt';
function a(){
console.log(name);
}
return {
a:a
};
});
// 加載模塊
require(['myModule'], function (my){
my.a();
});
? ? CMD:通用模塊定義馏予,SeaJS,SeaJS要解決的問題和requireJS一樣盔性,只不過在模塊定義方式和模塊加載(運(yùn)行霞丧、解析)時機(jī)上有所不同
? ? ? ? ?define(id?, deps?, factory)
? ? ? ? ? ? factory有三個參數(shù)
? ? ? ? ? ? ?function(require, exports, module)? require 是一個方法,接受 模塊標(biāo)識 作為唯一參數(shù)冕香,用來獲取其他模塊提供的接口;;;exports 是一個對象蛹尝,用來向外提供模塊接口;;;module 是一個對象后豫,上面存儲了與當(dāng)前模塊相關(guān)聯(lián)的一些屬性和方法
? eg---
定義模塊? myModule.js
define(function(require, exports, module) {
var $ = require('jquery.js')
$('div').addClass('active');
});
seajs.use(['myModule.js'], function(my){
});
4:AMD與CMD的區(qū)別
AMD推崇依賴前置,在定義模塊的時候就要聲明其依賴的模塊
CMD推崇就近依賴突那,只有在用到某個模塊的時候再去require
三:defer和async區(qū)別(都可以實現(xiàn)異步加載)
defer ? 并行加載js文件硬贯,會按照頁面上script標(biāo)簽的順序執(zhí)行
async ? ?并行加載js文件,下載完成立即執(zhí)行陨收,不會按照頁面上 ? ? ? ? ? ? ? ?script標(biāo)簽的順序執(zhí)行