1,ES5/ES6 的继承除了写法以外还有什么区别?
ES5的继承实质上是先创建子类的实例对象,然后再将父类的方法添加到this上(Parent.apply(this)).
ES6的继承机制完全不同,实质上是先创建父类的实例对象this(所以必须先调用父类的super()方法),然后再用子类的构造函数修改this。
ES5的继承时通过原型或构造函数机制来实现。
ES6通过class关键字定义类,里面有构造方法,类之间通过extends关键字实现继承。子类必须在constructor方法中调用super方法,否则新建实例报错。因为子类没有自己的this对象,而是继承了父类的this对象,然后对其进行加工。如果不调用super方法,子类得不到this对象。
2,http状态码有哪些?分别是什么意思?
简单版:
100 Continue 继续,一般在发送post请求时,已发送了http header之后服务端将返回此信息,表示确认,之后发送具体参数信息
200 OK 正常返回信息
201 Created 请求成功并且服务器创建了新的资源
202 Accepted 服务器已接受请求,但尚未处理
301 Moved Permanently 请求的网页已永久移动到新位置。
302 Found 临时性重定向。
303 See Other 临时性重定向,且总是使用 GET 请求新的 URI。
304 Not Modified 自从上次请求后,请求的网页未修改过。
400 Bad Request 服务器无法理解请求的格式,客户端不应当尝试再次使用相同的内容发起请求。
401 Unauthorized 请求未授权。
403 Forbidden 禁止访问。
404 Not Found 找不到如何与 URI 相匹配的资源。
500 Internal Server Error 最常见的服务器端错误。
503 Service Unavailable 服务器端暂时无法处理请求(可能是过载或维护)。
3,浏览器是如何渲染页面的?
浏览器从HTTP服务器获取html文档,到呈现页面给用户,会经过以下几个步骤:
(简述浏览器渲染过程
解析HTML以构建DOM树:渲染引擎开始解析HTML文档,转换树中的html标签或js生成的标签到DOM节点,它被称为 — 内容树。
构建渲染树:解析CSS(包括外部CSS文件和样式元素以及js生成的样式),根据CSS选择器计算出节点的样式,创建另一个树 — 渲染树。
布局渲染树: 从根节点递归调用,计算每一个元素的大小、位置等,给每个节点所应该出现在屏幕上的精确坐标。
绘制渲染树: 遍历渲染树,每个节点将使用UI后端层来绘制。
)
1、解析文档构建DOM树
浏览器的解析内容可以分为三个部分:
HTML/XHTML/SVG:解析这三种文件后,会生成DOM树(DOM Tree)
CSS:解析样式表,生成CSS规则树(CSS Rule Tree)
JavaScript:解析脚本,通过DOM API和CSSOM API操作DOM Tree和CSS Rule Tree,与用户进行交互。
以上三类文件的执行顺序会根据其在文档中的位置及其标签属性的不同而有异同,具体在后文进行讨论。
2、构建渲染树
解析文档完成后,浏览器引擎会将 CSS Rule Tree 附着到DOM Tree 上,并根据DOM Tree 和 CSS Rule Tree构造 Rendering Tree(渲染树)。此处需要注意:
Render Tree和DOM Tree的区别在于,类似Head或display:node之类的东西不会放在渲染树中;
将CSS Rule Tree匹配到DOM Tree需要解析CSS的选择器,为了提高该过程的性能,DOM树应该尽量小,CSS Selector应该尽量使用id和class,避免过度层叠。
3、布局与绘制渲染树
解析position, overflow, z-index等等属性,计算每一个渲染树节点的位置和大小,此过程被称为reflow。最后调用操作系统的Native GUI API完成绘制(repain)。注意:
渲染树的节点,在Gecko中称为frame,而在webkit中称为renderer;
reflow和repaint是两个不同的概念,其区别会在后文进行探讨。
4,typeof和instanceof相同点与不同点
相同点:
typeof和instanceof都用来判断一个变量的数据类型。
不同点:
typeof返回值是一个字符串, 用来说明变量的数据类型。
typeof一般只能返回如下六个数据类型,null会返回Object,若参数为引用类型,始终返回object :number, boolean, string, function, object, undefined。
instanceof返回一个布尔值。
instanceof一般用来判断一个变量是否来自某个引用类型的实例,判断在其原型链中是否存在一个构造函数的prototype属性,如:
console.log([]instanceofArray);// trueconsole.log([]instanceofObject);// true
可以看到的是[]是来自于Array是没有问题的,返回值为true;但是[] instanceof Object也为true是我们不想看到的,这是因为在javascript中,Object是最顶级的数据类型,所有的引用类型最终都会指向Object
对于这种情况,我们可以使用ES6新增的Array.isArray([])来进行判断,也可以通过[].constructor === Array来判断
网友评论