前端知识点总结---口试专用

2024年5月30日 211次阅读来源: _ipo

1.关于基础css html js部份

1.1基础算法

1）疾速排序

时候复杂度 nlogn

function quickSort(arr){
    if (arr.length<=1){
        return arr;
    }
   var pivotIndex = 0,
        pivort = arr.splice(pivortIndex, 1)[0];
    var left = [],
        right = [];
    for (var i = 1, length = arr.length; i < length; i++) {
        if (arr[i] < pivort) {
            left.push(arr[i]);
        }else if (arr[i] > = pivort) {
            right.push(arr[i]);
        }
    }
   return quickSort(left).concat([pivort], quickSort(right));
}

2) 二分查找算法

时候复杂度：logn(以2为底n的对数)

二分查找的基础思想是将n个元素分红大抵相称的两部份，去a[n/2]与x做比较，如果x=a[n/2],则找到x,算法中断；如果x<a[n/2],则只需在数组a的左半部份继续搜刮x,如果x>a[n/2],则只需在数组a的右半部搜刮x.

时候复杂度不过就是while轮回的次数！

总共有n个元素，

逐渐跟下去就是n,n/2,n/4,....n/2^k，个中k就是轮回的次数

由于你n/2^k取整后>=1

即令n/2^k=1

可得k=log2n,（是以2为底，n的对数）

所以时候复杂度可以示意O()=O(logn)

function binarySearch (arr, value) {
    var low = 0,
        high = arr.length - 1,
        mid;
    while (low <= high) {
        mid = Math.floor((low + high)/2);
      if (arr[mid] == value) {
          return mid;
      }else if (arr[mid] < value) {
          low = mid +1;
      }else if (arr[mid] > value) {
          high = mid -1;
      }else {
          return -1;
      }
    }
}

3)单向链表反转

顺次将第2—N个节点逐次插进去到第一个节点后，末了将第一个节点挪到新表的末端

例子为单向链表，头结点为空

时候复杂度：N

function reverse (list) {

//空链表

    if (list.head.next == null) {
        return list;
    }
//非空链表
    var p = list.head.next,
        q;
    while (p.next !== null) {
        q = p.next;
      p.next = q.next;
      q.next = list.head.next;
      list.head.next = q;
    }
    return list;
}

4)查找单向链表的倒数第K个节点

function searchK (list, k) {
    var head = list.head;
    if (head == null || k == 0) {
        return null;
    }
    //第一个节点先向前走K-1步
    var firstNode = head;
    for (var i = 0; i < k-1; i++) {
        firstNode = firstNode.next;
    }
    //推断链表长度是不是有K长
    if (i!== k-1) { 
        return null;
   }
   //两个节点同时走
   var secondNode = head;
   while (firstNode.next !== null) {
           secondNode = secondNode.next;
      firstNode = firstNode.next;
   }
   return secondNode;
}

5)深度克隆

function clone (test) {
    if (Array.isArray(test)) {
        var arr = [];
       for (var i = 0, length = test.length; i < length; i++) {
               arr.push(clone(arr[i]));
       }
    }else if (typeOf test === "object") {
        var obj = {};
       for (var j in test) {
               obj[j] = clone(test[j]);
       }
       return obj;
    }else {
        return test;
    }
}

6)数组去重

比方去重[‘1’,1,2,2,NaN,NaN,null,undefined]

特别注重1，’1′

NaN

function _isNaN (value) {
    return typeof value === 'number' && isNaN(value);
}
function unique (arr) {
    var type = '',
        key = '',
        res = [],
        hash = {};
    for(var i= 0,len=arr.length;i<len;i++){
        if(_isNaN(arr[i])){
            if(!hash[arr[i]]){
                hash['NaN'] = true;
                res.push(arr[i]);          
            }
        }else{
            type = typeof arr[i];
            key = type + arr[I];
            if(!hash[key]){
                hash[key] = true;
                res.push(arr[i]);
            }
        }
    }
    return res;
}

7）两个栈完成一个行列
https://segmentfault.com/a/11…

1.2 replace,match,search正则婚配是string的要领

str.replace(/ /g,'20%');
g示意全局婚配，不会婚配完第一个就不婚配了

i疏忽大小写

m多行婚配

1.3 Rexg正则婚配test,exec

test,返回一个 Boolean 值，它指出在被查找的字符串中是不是存在情势。
如果存在则返回 true，不然就返回 false。

exec,用正则表达式情势在字符串中运转查找

var str=" 12 er 45 ;; ";var rexg=/ /;rexg.exec(str);

Array[1]
0: " "
index: 0
input: " 12 er 45 ;; "
length: 1
__proto__: Array[0]

var str=" 12 er 45 ;; ";var rexg=/ /;rexg.exec(str);
[" "]0: " "index: 0input: " 12 er 45 ;; "length: 1__proto__: Array[0]

var str=" 12 er 45 ;; ";str.match(/ /g,'20%');
[" ", " ", " ", " ", " "]

var str=" 12 er 45 ;; ";str.replace(/ /,'20%');
"20%12 er 45 ;; "

var str=" 12 er 45 ;; ";str.match(/ /,'20%');
[" "]

var str=" 12 er 45 ;; ";str.search(/ /,'20%');
0

var str=" 12 er 45 ;; ";str.search(/ /g,'20%');
0

var str=" 12 er 45 ;; ";var rexg=/ /;rexg.test(str);
true

1.4 闭包

定义：

可以接见外部函数作用于中变量的函数
被内部函数援用的外部函数的变量保存在外部作用域中而不被接纳

优瑕玷：

长处：

变量私有化

削减全局变量污染

可以让一个变量常驻内存

瑕玷：

内存走漏

闭包会照顾包含它的函数的作用域，因而会比其他函数占用更多的内存

1.5 js数组

数组可以当栈用：

arr.unshift(val)进栈，顺次向前插进去

arr.pop()出栈 取得数组末了一项,原数组转变削减末了一项

完成了先进后出

数组当行列或许平常数组用：

arr.push(val),递次增添
arr.shift(),抛出第一个值即arr[0]，原数组转变削减第一项

2.关于JS耽误加载

       JS耽误加载的体式格局：
    
    1.位置，js放在</body>终了标签前 
    
    2.监听，window.onload后再增添script标签
    
    3.属性，为script标签增添属性defer或async 
    
    4.ajax下载js剧本后eval()实行

3.defer和async的比较

3.1 defer="defer"，defer默许false:
该属性用来关照浏览器，这段剧本代码将不会发作任何文档内容。
比方 JavaScript代码中的document.write()要领将不会骑作用,浏览器碰到如许的代码将会疏忽，并继续实行背面的代码。
属性只能是 defer，与属性名雷同。
在HTML语法花样下，也许可不定义属性值，仅仅运用属性名。

3.2 async="true/false",只写async省略属性值的状况下为true:
该属性为html5中新增的属性，它的作用是可以异步地下载和实行剧本，不由于加载剧本而壅塞页面的加载。
一旦下载终了就会马上实行。

加上defer 等于在页面完全载入后再实行，相当于文档载入后即实行，没必要等包含图片在内的资本下载终了。
async和defer一样，都不会壅塞其他资本下载，所以不会影响页面的加载，
但在async的状况下，js文档一旦下载终了就会马上实行，所以很有能够不是依据底本的递次来实行，如果js有依靠性，就要注重了。

3.3 雷同点：    
加载文件时不壅塞页面衬着；
运用这两个属性的剧本中不能挪用document.write要领；
许可不定义属性值，仅仅运用属性名；

 3.4 差别点：
html的版本html4.0中定义了defer；html5.0中定义了async；这将构成由于浏览器版本的差别而对其支撑的程度差别；
 实行时候：每个async属性的剧本都在它下载终了以后马上实行，同时会在window的load事宜之前实行。
所以就有能够涌现剧本实行递次被打乱的状况；
每个defer属性的剧本都是在页面剖析终了以后，依据底本的递次实行，同时会在document的DOMContentLoaded之前实行。

3.5 混合用
如果async为true，那末剧本在下载完成后异步实行。
如果async为false，defer为true，那末剧本会在页面剖析终了以后实行。
如果async和defer都为false，那末剧本会在页面剖析中，住手页面剖析，马上下载而且实行。

4.关于ajax

var xhr = new XMLHttpRequest(); IE new ActiveXObject(“Microsoft.XMLHTTP”);

1.xhr.open()

三个参数：

1）要求体式格局，post/get

2）要求的URL

3）是不是发送异步要求 true/false

注重： 只是启动，并未发送要求，要挪用send

2.xhr.send()

一个参数：必需有

参数为http要求的主体

post要求平常传入

get要求必需传入null

发送后取得效劳器的相应，相应的数据会自动添补xhr的属性

responseText,相应主体

responseXML

status，http状况码

statusText，状况申明

3.xhr.readyState

怎样推断效劳器相应已到位，怎样推断相应所处阶段

xhr.readyState:0,1,2,3,4
4示意完成，收到悉数相应

4.xhr.status

((status >= 200 && status <300) || status = = = 304 )

示意要求胜利

5.xhr.onreadystatechange事宜

readyState转变一次，onreadystatechange事宜触发一次

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4){
    try {
        if((xhr.status >= 200 && xhr.status <300) || xhr.status == 304){
            console.log(xhr.responseText);
        }else{
            console.log("erro:" + xhr.status);
        }
    }catch(ex){
        //ontimeout处置惩罚
    }
    }
};
xhr.open("get","example.js",true);//异步
xhr.send(null);

6.对GET,POST要求参数的处置惩罚

GET

1) encodeURIComponent()对参数键和值举行编码，保证花样准确

2) 键=值对之间以 & 离开

function addURLParam(url,name,value){
    url + = (url.indexOf("?") = = -1 ? "?" : "&");
    url + = encodeURIComponent(name) + "=" + encodeURIComponent(value);
    return url;
}

POST

XMLHttpRequest 1级的完成：

1）Content-Type的设置：xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");

2）serialize()序列化数据

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4){
    try {
        if((xhr.status >= 200 && xhr.status <300) || xhr.status == 304){
            console.log(xhr.responseText);
        }else{
            console.log("erro:" + xhr.status);
        }
    }catch(ex){
        //ontimeout处置惩罚
    }
    }
};
xhr.open("post",url,true);//异步
xhr.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
var form = document.getElementById("exampleID");
xhr.send(serialize(form));

XMLHttpRequest 2级
增添了FormData:没必要明白头部范例

var xhr = new XMLHttpRequest();
xhr.onreadystatechange = function(){
    if(xhr.readyState == 4){
    try {
        if((xhr.status >= 200 && xhr.status <300) || xhr.status == 304){
            console.log(xhr.responseText);
        }else{
            console.log("erro:" + xhr.status);
        }
    }catch(ex){
        //ontimeout处置惩罚
    }
    }
};
xhr.open("post",url,true);//异步

var form = document.getElementById("exampleID");
xhr.send(new FormData(form));

7.XMLHttpRequest 2 级

xhr.timeout = 属性值

xhr.ontimemout = function(){
 console.log("超时未收到相应");
};

在划定时候内浏览器未收到相应就触发 ontimeout 事宜

5.关于web存储

5.1 cookie,sessionStorage,localStorage区分？

sessionStorage,loalStorage统称webStorage;

Cookie的作用是与效劳器举行交互,作为HTTP范例的一部份而存在,而Web Storage仅仅是为了在当地“存储”数据而生

（1）存储大小：


    cookie,4k;  sessionStorage,localStorage,5M或更大;

（2）逾期时候：

       cookie,逾期时候前一向有用，默许cookie（没有设置expires的cookie）失效时候直到封闭浏览器，设置体式格局
    
    保存COOKIES一个小时------Response.Cookies("MyCookie").Expires = DateAdd("h", 1, Now());
    
   sessionStorage封闭即删除，只需同源的同窗口（或tab）中，革新页面或进入同源的差别页面，数据一直存在
   
   loalStorage永不丧失

（3）效劳器交互带宽运用状况：

       
    cookie放在要求头发送给效劳端，糟蹋带宽
    
    sessionStorage,loalStorage无于效劳端交互

（4）存储位置：

       cookie以键值对情势存储在http要求的header中发送给效劳端，同时从效劳端取得的cookie是 键=值分号离隔的情势存储 
    
   sessionStorage,localStorage存储在当地

（5）同享：

       cookie受同源战略限定
    
    sessionStorage一致窗口同享
    
    localStorage受同源限定

（6）用法：

       
    cookie须要本身封装要领
    
    * escape()函数是JS内置函数，编码将字符串编码为16进制，unescape()解码

1．增添一个cookie
<script language="JavaScript" type="text/JavaScript">
<!--
function addcookie(name,value,expireHours){
      var cookieString=name+"="+escape(value);
      //推断是不是设置逾期时候
      if(expireHours>0){
             var date=new Date();
             date.setTime(date.getTime()+expireHours*3600*1000);
             cookieString=cookieString+"; expire="+date.toGMTString();
             
             // 或许cookieString+=";max-age="+60*5;  /* 设置cookie的有用期为5分钟 */
      }
      document.cookie=cookieString;
}
//-->
</script>
2．猎取指定称号的cookie值：getcookie(name)
该函数返回称号为name的cookie值，如果不存在则返回空，其完成以下：
<script language="JavaScript" type="text/JavaScript">
<!--
function getcookie(name){
      var strcookie=document.cookie;
      var arrcookie=strcookie.split(";");
      for(var i=0，len=arrcookie.length;i<len;i++){
            var arr=arrcookie[i].split("=");
            if(arr[0]==name)return unescape(arr[1]);
      }
      return "";
}
//-->
</script>
3．删除指定称号的cookie：deletecookie(name)
该函数可以删除指定称号的cookie，其完成以下：
<script language="JavaScript" type="text/JavaScript">
<!--
function deletecookie(name){
    var cookieValue = getCookie(name);
    
    var cookieString = null;
    
    if(cookieValue！== "" || cookieValue!==null){
        cookieString = name + "=" + escape(cookieValue) + ";max-age=" + 0;
    }
    
    document.cookie = cookieString;
}
//-->
</script>

cookie 的属性：Domain(设置子域该域下才可接见cookie)

HttpOnly(设置后将不能用JS剧本操纵cookie),

Secure(设置后将只能经由过程HTTPS协定接见),

Expiress（逾期时候，不设置默许封闭浏览器cookie失效）,现在已被max-age属性所庖代 max-age用秒来设置cookie的生命周期

Path（设置途径的页面才可接见cookie）

sessionStorage,localStorage有接口：

setItem,getItem,removeItem,clear

比方消灭一切的key/value
sessionStorage.clear(); localStorage.clear(); 
sessionStorage.setItem("key", "value");
var value = sessionStorage.getItem("key");
sessionStorage.removeItem("key");

5.关于http

5.1 状况码


200 OK - [GET]：效劳器胜利返回用户要求的数据，该操纵是幂等的（Idempotent）

 201 CREATED - [POST/PUT/PATCH]：用户新建或修正数据胜利
 
202 Accepted - [*]：示意一个要求已进入背景列队（异步使命）

204 NO CONTENT - [DELETE]：用户删除数据胜利。

301,302,303 redirect:重定向;

    301永远性重定向 增添SEO排名，说说
    
    302临时重定向,
    
  303：关于POST要求，它示意要求已被处置惩罚，客户端可以接着运用GET要领去要求Location里的URI。
  
    307：关于POST要求，示意要求还没有被处置惩罚，客户端应该向Location里的URI从新提议POST要求。
    
304not modified：未修正返回缓存的内容不再要求新的;request If-None-Match

400：客户端的URL输入有题目，浏览器剖析不出来 
 
401：须要身份考证

403：已考证身份经由过程，然则效劳器不予实行

404：对客户端要求效劳端找不到资本

406 Not Acceptable - [GET]：用户要求的花样不可得（比方用户要求JSON花样，然则只要XML花样）

410 Gone -[GET]：用户要求的资本被永远删除，且不会再取得的

422 Unprocesable entity - [POST/PUT/PATCH] 当建立一个对象时，发作一个考证毛病

503：效劳器临时没法供应效劳，过一会就好了

5.2 GET和POST的区分？

GET – 从指定的资本要求数据

POST – 向指定的资本提交要被处置惩罚的数据

大小限定

get 1024字节

post 无限定，但可以自行设定

平安性

post较get平安

数据寄存

get传输的参数附在URL背面

post传输的数据放在HTTP要求体中

幂等

get是幂等的，post不是

缓存，珍藏，汗青

get都可以，post没有

6.关于收集平安

xss(cross site script)跨站剧本进击：

 Reflected XSS（基于反射的XSS进击）：搜刮框内键入歹意代码
 
 Stored XSS（基于存储的XSS进击）：宣布的帖子/文章键入歹意代码
 
 DOM-based or local XSS（基于DOM或当地的XSS进击）：免费WIFI中心网关对网页修正嵌入歹意代码
 
 提防：前端对要显现的内容和效劳端返回的内容举行转码htmlencode
 
     效劳端对要求的内容举行考证提防进击
     
     xss进击主如果拿到cookie，所以可以制止操纵cookie,设置HttpOnly属性
 
 细致见  https://segmentfault.com/a/1190000008423064

CSRF跨站要求捏造 cross site request forgery

   概况：https://segmentfault.com/a/1190000008424201

   假装用户提议要求（在用户不知情的状况下）,完成一些违犯用户志愿的要求
（比方漫衍的小广告点进去就完成转正操纵了如果你方才登录过网上银行session照旧未逾期）

   防备要领：

          考证HTTP要求头部的referer即可晓得是不是是bank.com提议的要求;
          
       要求地点中增添token并考证;
       
       HTTP头部增添自定义属性并考证;
       
       考证码

XSS：

进击者发明XSS破绽——组织代码——发送给受害人——受害人翻开——进击者猎取受害人的cookie——完成进击

CSRF：

进击者发明CSRF破绽——组织代码——发送给受害人——受害人翻开——受害人实行代码——完成进击

SQL注入进击

组织奇妙的SQL语句，从而胜利猎取想要的数据；黑客的填空游戏

某个网站的登录考证的SQL查询代码为：
strSQL = “SELECT * FROM users WHERE (name = ‘” + userName + “‘) and (pw = ‘”+ passWord +”‘);”
- 歹意填入
userName = “1′ OR ‘1’=’1”;
- 与
passWord = “1′ OR ‘1’=’1”;
- 时，将致使底本的SQL字符串被填为
strSQL = “SELECT * FROM users WHERE (name = ‘1’ OR ‘1’=’1′) and (pw = ‘1’ OR ‘1’=’1′);”
- 也就是实际上运转的SQL敕令会变成下面如许的
strSQL = “SELECT * FROM users;”
防备要领 ：对输入举行考证整形参数推断 unicode转换等

7.关于跨域

同源战略

1 协定雷同

2 域名雷同

3 端口雷同

跨域的要领

1.window.postMessage(message,targetOrigin) （双向跨域）

2.document.domain = 配合的主域名跨子域（双向跨域）

   http://www.a.com/a.js
 http://script.a.com/b.js
 一致为主域名a.com

———————————————————-

3.jsonp（单向跨域）

   只支撑get要求


    <script src=".../callback()"></script>

4.CORS跨域资本同享（单向跨域）

   比JSONP壮大，支撑各种范例的HTTP要求

许可浏览器向跨源效劳器，发出XMLHttpRequest要求，从而克服了AJAX只能同源运用的限定

A跨域接见B，须要在B的相应头到场  Access-Control-Allow-Origin：http://A

5.效劳器代办（单向跨域）

   跨域的HTTP要求是在效劳器端

6.window.name （单向跨域）

8.关于构建东西gulp git grunt fis3

gulpjs是一个前端构建东西，与gruntjs比拟：

gulpjs无需写一大堆冗杂的设置参数，

而且gulpjs运用的是nodejs中stream来读取和操纵数据，其速率更快

npm install -g gulp  全局安装到本机c盘data中

npm install gulp  
安装到本项目标node moudule模块中

npm install --save-dev gulp  
将gulp依靠增添到本项目标packge.json的依靠内

就可以运转gulp敕令实行gulpfile.js文件内定义的default使命了

gulpfile.js内

常常使用的四个API：gulp.task(), gulp.src(), gulp.dest(),gulp.watch()

gulp.src

gulp.src(globs) 猎取文件流对象，是假造文件对象流，进而挪用stream.pipe()继续操纵流
       
经由过程指定gulp.src()要领设置参数中的base属性，我们可以更天真的来转变gulp.dest()天生的文件途径。
       
当我们没有在gulp.src()要领中设置base属性时，base的默许值为通配符最先涌现之前那部份途径。
          
例子：
gulp.src(script/lib/*.js, {base:'script'}) //设置了base参数，此时base途径为script
//假定婚配到的文件为script/lib/jquery.js
  .pipe(gulp.dest('build')) //此时天生的文件途径为 build/lib/jquery.js

gulp.dest


    gulp.dest(path) 用来写文件，path替换掉基础途径就是天生的文件的途径

gulp.task


gulp.task(name,[deps],fn) 使命的名字，依靠的使命，实行的要领
    
deps只要一个也要用数组括起来
    
如果使命A依靠B，B有异步编码，A不会等B的异步代码实行完而是直接实行，解决办法：
   
1，实行一个回调函数关照gulp异步完成
2，返回一个流对象
3，require Q;返回promise对象

gulp.watch


gulp.watch(glob,tasks) 婚配文件途径  文件转变后实行tasks(之前定义好的task,gulp.task(name,[deps],fn))
    
概况见 https://segmentfault.com/a/1190000008427866

关于GIT的发问

git rebase

git merge

等等概况见 https://segmentfault.com/a/11…

9.关于框架vue angularjs


v-for  ng-repeat

new vue({el:data:methods:})  

angular.module(name,[]) 继而controller

angular controller之间通讯体式格局：

上下级之间通讯：作用域继续、事宜触发（$on、$emit 和 $boardcast）

同级之间通讯：注入效劳 service、借助父级controller完成子级controller之间的通讯、借助$rootScope完成同级之间的通讯

10.关于nodejs

建立简朴的效劳器

var http = require("http"); 
 
http.createServer(function(request, response) { 
 
    response.writeHead(200, {"Content-Type": "text/plain"}); 
 
    response.write("Hello World"); 
 
    response.end(); 
 
}).listen(8888);

11.关于restfulAPI

1.协定

HTTPS协定

2.域名

可以增添次级域名

https://api.example.com

如果不须要扩大，可以放在主域名下

https://example.com/api

3.版本

为API增添版本

https://api.example.com/v1/

4.不许可动词

途径名词平常与数据库表格一向

https://api.example.com/v1/animals

5.参数设想

参数键值情势 & 标记离开

https://api.example.com/v1/animals?name='cat'&sex='1'

6.毛病处置惩罚

要求结果是毛病的4xx

平常返回的JSON数据中设置erro键

{
    error: "Invalid API key"
}

7.HTTP动词

常常使用的：GET,POST

GET（SELECT）：从效劳器掏出资本（一项或多项）

POST（CREATE）：在效劳器新建一个资本

尚有：

PUT（UPDATE）：在效劳器更新资本（客户端供应转变后的完全资本）

PATCH（UPDATE）：在效劳器更新资本（客户端供应转变的属性）

DELETE（DELETE）：从效劳器删除资本

HEAD：猎取资本的元数据

OPTIONS：猎取信息，关于资本的哪些属性是客户端可以转变的

8.状况码

上翻有

12.关于异步编程

ES 6之前：

回调函数（ajax完成异步的道理就是采用了回调函数）

function f1(callback){
　　　　setTimeout(function () {
　　　　　　// f1的使命代码
　　　　　　callback();
　　　　}, 1000);
　　    }

f1(f2);

题目：多层嵌套很杂沓，非常难以捕捉

事宜驱动/事宜监听宣布/定阅情势(观察者情势)
```
道理同 回调
```

promise对象

promise情势在任何时候都处于以下三种状况之一：
未完成（unfulfilled）、已完成（resolved）和谢绝（rejected）

promise对象上的then要领担任增添针对已完成和谢绝状况下的处置惩罚函数。
then(resolvedHandler, rejectedHandler); 
then要领会返回另一个promise对象，以便于构成promise管道，
这类返回promise对象的体式格局可以支撑开发人员把异步操纵串连起来

ES 6：

* Generator函数(协程coroutine)

ES 7:

* async和await

13.关于模块化编程 requirejs seajs commonjs

AMD（Require遵照的范例）define, require
CMD（SeaJS遵照的范例）常常运用的 API 只要 define, require, require.async, exports, module.exports 这五个

promise（commonJS提出的范例）

1.关于依靠的模块，AMD 是提早实行，CMD 是耽误实行。
不过 RequireJS 从 2.0 最先，也改成可以耽误实行（依据写法差别，处置惩罚体式格局差别）

2.CMD 推重依靠就近，AMD 推重依靠前置。

14.关于面向对象

14.1封装性

JS没有类，怎样谈封装呢。有对象，对象有属性

有组织函数，组织函数有基础属性值和援用属性值

函数有prototype原型，可以完成属性要领同享

14.2多态性

14.3继续性

某一对象的实例赋值给另一个对象的原型完成继续

组织函数、实例、原型的关联：

var a = function(){...};

var b = new a();//b 是由 a 组织出来的

var c = function(){...};

c.prototype = b;//c 继续了 a

15.关于跨装备相应式

1.百分比

2.挪动端禁viewport缩放功用

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no" />

width：viewport 的宽度，可以指定一个固定值，如650；或许可所以device-width，示意装备的宽度

height：和 width 相对应，可指定高度

initial-scale：页面初始缩放比例(0-1)

maximum-scale：许可用户缩放到的最大比例(0-1)

minimum-scale：许可用户缩放到的最小比例(0-1)

user-scalable：用户是不是可以手动缩放（yes/no）

禁用chrome 自调治字体大小

body {
    -webkit-text-size-adjust: 100%;
}

3.CSS3 media queries

@media only screen and (max/min-width/height: 960px) {
  /* 款式定义 */
}

@media only screen and (max-width:500px){
  .outDiv {
      margin: 0 auto;
  }
}

16.关于浏览器兼容

简朴总结

css 款式加前缀 -webkit如许子的

js 冒泡事宜和阻挠冒泡

许多见：http://blog.csdn.net/xingxing…

http://blog.csdn.net/comeonj/…

17.关于linux

临时放两个链接之前写过的：

https://segmentfault.com/a/11…

https://segmentfault.com/n/13…

18. 前端机能优化

HTTP:削减HTTP要求；解决办法：兼并图片，兼并css,js文件，lazzyload懒加载图片
CSS：合理用reflow,repaint:style变一次就reflow一次，因而尽量设一个新的class，转变className，reflow一次
DOM:削减DOM操纵，多用innerHTML一次增添
JSON花样交流数据，轻量级数据
css放在头部，js放在尾部，外部援用

6.CDN内容分发收集，及时性不太好

    原文作者：_ipo
    原文地址: https://segmentfault.com/a/1190000008448619
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。