undefined、、boolean、object、string、number、function、symbol(ES6新增)
if(obj.a == null) { //至关于obj.a === null || obj.a === undefined //除了这种状况用 == 以外,所有用 === //这是jquery的推荐写法 }
Object()、Array()、Boolean()、Number()、String()、Function()、Date()、RegExp()、Error() //注意:构造函数的函数名通常都以大写字母开头,本身定义的构造函数也尽可能这样写
当onload事件触发时,页面上全部的DOM,样式表,脚本,图片,flash都已经加载完成了。 当DOMContentLoaded事件触发时,仅当DOM加载完成,不包括样式表,图片,flash。
JSON首先是一种数据格式,也是js的一种内置对象,它有两个方法:stringify()(序列化)、parse()(反序列化)
js中变量分为两种类型,值类型:boolean、undefined、number、string和引用类型(object)。值类型的变量定义体和具体的值都存在栈内存中,因此var a = 123; var b = a; b = 456; 之后b等于456,a仍是等于123; 而引用类型的变量定义体存在栈内存中,而具体的值存在堆内存中,每次复制一个引用类型,至关于只是复制了一份引用。因此复制体改变,被复制体也会跟着同时改变。
两种办法: 一、 a instanceof Array; 二、 Object.prototype.toString.call(a) //a为要检测的变量,实际上第二种方法能够准确判断js中几乎全部的类型。 //而第一种方法只能判断引用类型,不能判断值类型,由于值类型没有对应的构造函数
一、生成一个新的空对象; 二、this指向这个新对象; 三、执行构造函数中的代码,即对this赋值; 四、将新对象的__prototype__属性指向构造函数的prototype属性; 五、返回this,即获得新对象。
一、做为构造函数执行 二、做为对象属性执行 三、做为普通函数执行 四、call bind apply 五、DOM事件中使用 六、js非strict模式下,this默认指向window对象
//考察js做用域和闭包的运用 <script> for(i = 0; i < 10; i++) { (function(i){ var a = document.createElement("a"); a.innerHTML = i + "<br/>"; a.addEventListener("click", function(){ alert(i); }); document.body.appendChild(a); })(i); } </script>
一、自由变量 二、做用域链、即自由变量的查找 三、闭包的两个场景
封装变量,收敛权限
常说的JS通常来讲包含两部分:php
一、JS基础知识(ECMA262标准),也就是语法标准,让js拥有基础编程语言的能力。 二、JS-Web-API(W3C标准),让js拥有操做dom和bom的能力。
一、querySelectorAll属于W3C的Selector API规范,而getElementsBy属于W3C的DOM规范。
二、方法接受的参数不同,前者接受的是css选择符,然后者只能是单一的ClassName、Id、或者TagName.
三、querySelectorAll返回的是static node List,而getElementsBy返回的是live node List,获取之后在添加元素,前者数量不变,后者数量会跟着增长。会致使一些死循环,参考:https://www.bbsmax.com/A/GBJr...
http://www.imooc.com/article/...css
document.getElementsBy系列、docuemnt.querySelectorAll、document.querySelector、 getAttribute(attrName)、setAttribute(attrName,val)、 appendChild(node) - 在最后插入新的子节点(元素)、 insertBefore(node) - 在前面插入新的子结点 removeChild(node) - 删除子节点(元素)、
Attribute是HTML标签的属性,property是JS对象的属性html
检测客户端前端
navigator.userAgent
检测屏幕vue
screen.width、screen.height
url操做node
location.href .protocol .pathname .search .hash
Trident内核:主要表明为IE浏览器 // -ms- Gecko内核:主要表明为Firefox //-moz- Presto内核:主要表明为Opera //-o- Webkit内核:产要表明为Chrome和Safari //-webkit-
1、域名到ip地址解析过程react
一、查找浏览器缓存
二、查找系统缓存(通常是hosts文件)
三、查找路由器缓存
四、查找ISP DNS 缓存
五、ISP发起一个迭代的DNS请求
(1)本地 DNS服务器即将该请求转发到互联网上的根域(即一个完整域名最后面的那个点,一般省略不写)
(2)根域将所要查询域名中的顶级域(假设要查询ke.qq.com,顶级域就是com)的服务器IP地址返回到本地DNS
(3) 本地DNS根据返回的IP地址,再向顶级域(就是com域)发送请求。
(4) com域服务器再将域名中的二级域(即ke.qq.com中的qq)的IP地址返回给本地DNS
(5) 本地DNS再向二级域发送请求进行查询
(6) 以后不断重复这样的过程,直到本地DNS服务器获得最终的查询结果,并返回到主机。这时候主机才能经过域名访问该网站。
域名解析的过程到此完成,至此浏览器拿到了域名对应的IP地址jquery
2、创建TCP/IP链接,经过TCP协议的三次握手,链接创建之后,浏览器就向服务器发起http请求,通常经过get或者post方法。
3、服务器端接受到这个请求,根据请求参数,经过相关的处理把结果,一个html代码,返回给服务器
4、浏览器拿到html代码,开始解析页面,里面的css、js、图片等静态资源,一样要通过上述步骤才能到达浏览器。
5、浏览器根据拿到的资源对页面进行渲染,最后将渲染完成的页面呈现给用户。webpack
200 //请求完成,成功返回数据 301 //所请求的页面已经转移至新的url 400 //客户端请求的语法错误,服务器没法解析 401 //请求要求用户的身份认证 403 //服务器理解请求客户端的请求,可是拒绝执行此请求,可能仍是没有权限 404 //客户端请求的资源不存在,最多见的一种状态码 500 //服务器错误 503 //因为超载或系统维护,服务器暂时的没法处理客户端的请求
cookies容量大约只有4KB、全部的http请求都带着它,会影响获取资源的效率,API太简单只有documet.cookies,使用的时候通常要经过字符串处理函数通过封装。
sessionStorage和localStorage容量有5M,API简单易用,它们两个惟一区别就是sessionStorage关闭浏览器会自动清除web
1、加载资源优化:
一、静态资源的合并压缩(利用webpack、gulp等,压缩合并js、css文件) 二、静态资源缓存(同一网站下静态资源的名字不变,浏览器不会从新请求) 三、使用CDN让资源加载更快(大公司都有本身的CDN) 四、使用SSR(server side render)后端渲染,数据直接输出到HTML中,是vue、react中提出的概念,可是其实在早期的php、asp、jsp中都是这种渲染形式。
2、渲染优化
一、CSS放前面,JS放后面 二、懒加载(图片懒加载,下拉加载更多,而不是一次性所有加载) 三、减小DOM查询,对DOM查询作缓存 四、减小DOM操做,多个操做尽可能合并在一块儿执行(利用createDocumentFragment,先将要插入的dom元素按次序放在Fragment中,再一次性将Fragment插入到已有的dom中) 五、事件节流 六、尽早操做,在DOMContentLoaded的时候就进行操做,而不是window.onload之后再进行,zepto和jquery都是用前者
一、XSS(Cross-site Scripting)跨站请求攻击例如:攻击者在文章里面写入一段<script>获取cookies的一些操做,发送到本身的服务器</script>,别人点开文章,就至关于执行了这个脚本,攻击者就能够得到别人的隐私信息解决方法:前端替换关键字,例如替换 < 为<, > 为> 。 因为前端性能有限,通常这些工做交给后端处理 二、XSRF(Cross-site request forgery)跨站请求伪造攻击者伪形成被攻击者向服务器发送请求,形成财产损失解决方法:增长验证流程,密码,短信验证码。