一、CSS和JS在网页中的放置顺序是怎样的?
-
css一般放在html中的head标签之中,一般在meta和title标签之后
页面渲染首先是根据DOM结构生成一个DOM树,然后加上css样式生成一个渲染树,如果将css放在最后,页面可能会出现闪跳、白屏或样式混乱等。 -
js一般放在body标签的最后,也就是</body>之前
js是阻塞加载的,若是放在前面,会影响页面的加载速度,若是js文件过大,这种影响就会更大,可以使用异步加载的方法来解决阻塞加载的问题。 -
简单而言,以这种方式来放置css和js,可以让页面的内容更早,更快的被加载出来。
二、解释白屏和FOUC
在不同浏览器对css和html的处理方式不同,一种是等待css加载完成后,对html
进行渲染并显示,有的是先对html元素进行展示,等css加载完成之后,再对html进行样式的设置;前者会造成白屏,后者则会造成FOUC。
三、async和defer的作用是什么?有什么区别?
-
async---异步脚本,作用是:告诉浏览器立刻下载其指定的js,与此同时会同步加载页面的内容部分,不会因为js的存在而导致浏览器必须先下载并执行js后再加载后面的内容;(因此建议异步脚本不要在加载期间修改DOM)
-
defer--延迟脚本,作用是遇到js时立即下载,但延迟到</html>之前的内容全部加载完后再执行;这样不会因此js的存在导致阻塞了后面的页面内容的呈现
区别:
1、执行时间不一样:async的js在下载完后会立即执行(因此脚本在代码中的顺序并不是脚本所执行的先后顺序,有可能后面出现的脚本先执行),但defer则要等待整个页面内容及样式全部加载完后再执行;(HTML5规范要求脚本执行应该按照脚本出现的先后顺序执行,但实际情况下,延迟脚本不一定按照先后顺序执行。
2、HTML版本不一样:html的版本html4.0中定义了defer;html5.0中定义async;
3、浏览器支持情况不一样
四、简述网页的渲染机制
(1).根据URL向服务器请求数
(2).根据来自服务器端的HTML形成文档对象模型,即DOM
(3).加载并解析css样式代码,形成css对象模型。
(4).在DOM和css对象模型上,创建一棵由一组待生成渲染的渲染树,,渲染树反应了文档对象模型的结构,其中的每一段文本字符串都表现为一个独立的渲染器,每一个渲染器都包含与之对应的DOM对象,文本块和之前所计算出来的样式。
(5).对渲染树上的每一个元素,计算它的坐标,称为布局。
(6).最后,渲染书中所包含的内容显示在浏览器上。
(7).当用户与网页交互,或者脚本程序操作DOM内容等,上述过程就会重新再来一次。
五、JavaScript 定义了几种数据类型? 哪些是简单类型?哪些是复杂类型?
ECMAScript中规定了7种数据类型,包括6中原始数据类型和object。
1.Boolean 布尔类型;其中有两个值:true false
2.Null 空值(null or an empty value);只有一个值 null
3.undefined 一个已经被声明,但没有被赋值的变量拥有一个默认值,就是undefined undefined(首字母小写)是它唯一的值
4.String 字符串类型,用于表示文本数据,它的索引值从0开始。
5.Number 在ECMAScript标准中,只有一种数字类型,即Number,它包括了整数
、浮点数、正负Infinity和NaN
6.Symbol 符号类型,是在ECMAScript中新增的一个类型,它是唯一的,也是不
可修改的。
7.object 对象类型,它是内存中可以被标识符引用的一个区域
六、NaN、undefined、null分别代表什么?
- NaN not a number,它是一个Number类型的值,但是不能被表示出来,另外需要注意的一点是,它和自己本身并不相等。
- undefined 一个已经被声明,但没有被赋值的元素有一个默认值,就是undefined,一个没有传入实参的形参的值也是undefined,如果一个被定义的函数没有返回值,那么它的返回值也是undefined。
- null 空值,是JavaScript中的一个字面量,也是JavaScript的原始值之一
七、typeof和instanceof的作用和区别?
两者均能判断一个变量是否为空或者是什么类型的变量。
-
typeof:用于获取一个数据的类型,它所返回的结果一般有:boolean,number、string、function、object和undefined,它对于Array、null和其他对
象的返回值均为object,这也是它的局限性 -
instanceof:如果希望知道一个对象是数组还是空值或者是其他的对象,就用
到了这个函数,instanceof用于判断某个变量是否是某个对象的实例,它要求明
确确定对象为某个特定类型,而不是笼统的object -
此外,typeof是一个一元运算符,放在运算数的前面,以判断类型,而
instanceof则是一个二元运算符,它的返回值是一个布尔值。
代码任务二:
console.log(1+1); //数字2
console.log("2"+"4"); //字符串24
console.log(2+"4"); //字符串24
console.log(+new Date());//转成毫秒
console.log(+"4");//数字4
代码任务三:
var a = 1;
a+++a; // 3 首先a++运算后,a++依然是1,但a已经变成2,即1+2=3
typeof a+2; //number2 typeof的优先级高,所以首先判断typeof a 结果是number,再+2,完成一个字符串的拼接.
代码任务四:
arr = [3,4,5];
for(i in arr){console.log(arr[i]*arr[i]);
代码任务五:
var obj = {
name : 'hunger',
sex : 'male',
age : 28
}
for(i in obj){
console.log(obj[i]);
}
代码任务六:
console.log(a); // undefined 由于变量提升,所以a已经被声明
var a = 1;
console.log(a); // 1
console.log(b); // 报错 b is not define
网友评论