前端知识汇总

盒子模型

2种：IE盒子模型 W3C标准盒子模型

盒模型：内容、内边距、外边距、边框

为什么要初始化样式

浏览器兼容问题，不同浏览器对标签默认值不同，造成差异

严格模式&混杂模式

严格模式：页面排版与JS解析以该浏览器支持的最高标准来执行

混杂模式：不严格按照标准执行，主要用来兼容旧浏览器

DOCTYPE不存在或格式不正确会导致文档以混杂模式呈现

空元素有哪些

<br> <hr> <img> <link> <meta>

display属性

1.display：block 行内元素转为块级元素

2.display:inline 块级元素转为行内元素

3.display:inline-block 转为内联元素

JS的typeof返回那些数据类型

object number function boolean underfined string

强制类型转换和隐式类型转换

强制：parseInt parseFloat Number()

隐式：（==）

split() & join()

split() 切割成数组

join() 将数组转字符串

pop() push() unshift() shift()

push() 尾部添加

pop() 尾部删除

unshifit() 头部添加

shift() 头部删除

事件绑定的三种方式

1.div1.onclick = function(){}

同一元素绑定两次以上相同类型的事件，后面的绑定覆盖前面

不支持DOM事件流

（DOM事件流：事件捕获阶段——目标元素阶段——事件冒泡阶段）

2.addEventListener("click",function(){},true)(此时事件是在事件冒泡阶段执行)

依次触发绑定事件

支持DOM事件流

传参不需要ON前缀

3.ie9以前：attachEvent/detachEvent

进行事件类型传参需要on前缀

只支持事件冒泡，不支持事件捕获

事件绑定是指把事件注册到具体的元素之上，普通事件指可以用来注册的事件

IE&DOM事件流区别

执行顺序不一样

参数不一样

事件加不加on

this指向问题

call&apply

相同点:改变this指向，为了使用一个本不属于这个对象的方法

不同点：apply传入的参数是一个数组

call传入的参数用逗号隔开

事件委托

利用事件冒泡原理，让自己所触发的事件，让他的父元素代替执行

闭包

概念：函数A里有函数B，函数B能够访问函数A的变量及数据

缺点：造成内存泄露

优点：延长

阻止事件冒泡和默认事件

e.stopPropagation()//标准浏览器

event.cancelBubble = true//IE9以前

阻止默认事件

return false

e.preventDefault()

添加 删除 替换 插入到某个节点的方法

obj.appendChild()

obj.insertBefore()

obj.replaceChild()

obj.removeChild()

创建新节点

createElement() 创建具体的元素

createTextCode() 创建文本节点

createDocumentFragment() 创建一个DOM片段

查找节点

getElementsByTagName()

getElementsByName()//name属性

getElementById()

本地对象、内置对象、宿主对象

本地：array\obj\regexp等可以new实例化

内置：Math Date

宿主：浏览器自带的document window

document load & document ready

onload:是在结构和样式加载完毕才执行JS

ready：是在jQuery中表示文档结构已经加载完成（不包含图片等非文字媒体文件）

同源策略

IP 端口 协议 相同

数据类型

基本：String ,Boolean, number, undefined,null

引用：object

如何判断变量是否是数组数据类型

是否具有数组性质的方法，如slice()

alert(obj istanceof Array )

Array.isArray()

获取input输入框的值

document.getElementById("id").value

undefined & null 区别

null：Null类型，代表空值 使用typeof运算得到“object”，访问一个尚未存在的对象

undefined：undefined类型，当一个变量声明了但未初始化时

什么情况会产生undefined

声明一个变量未初始化

获取一个变量不存在的属性或方法

一个数组中没有被赋值的元素

foo = foo||bar ?

短路表达式

如果foo存在，值不变，否则把bar的值赋给foo

if条件判断，以下情况是false

空字符串、false 、undefined 、null 、0

举例浏览器对象模型中常用的对象 以及常用的方法

对象：window document location screen history navigator

方法：Alert() confirm() prompt() open() close()

创建函数的几种方式

函数声明

function sum (n1, n2) {
    return n1 + n2
}

函数表达式

var sum2 = function (n1, n2) {
    return n1 +n2
}

匿名函数

(function(){
    console.log("hello world")
})()

函数对象方式

var sum3 = new Function("num1", "num2", "return num1 + num2")

何如实现继承

原型链。借用构造函数 组合继承

创建对象的方式

工厂模式 构造函数创建对象 原型模式

Cookie的弊端

长度和数量限制 每个domain最多20条cookie 长度不超过4k