js简单认知
2016-10-16 本文已影响0人
没梦想的咸鱼丶
1.CSS和JS在网页中的放置顺序是怎样的？
-
csslink引入放置在头部<head>标签里 -
js放置在网页底部
2.解释白屏和FOUC
-
当把
css样式放在页面底部或者使用@import引入,还有js放头部加载造成阻塞时，就会出现这两种情况-
白屏：一些浏览器例如chrome，会等
css全部加载完成之后再进行渲染展示页面，这个等待的时间就会出白屏。 -
FOUC(flash of unstyled content)：而例如ie浏览器某些场景下（打开新窗口，刷新）会在未加载
css的时候会根据元素默认样式就绘制页面，而当css加载完成之后，又会重新绘制一遍。
-
-
而这两种情况的出现是因为浏览器渲染机制不同造成的，像FF会一直表现出FOUC，最好的解决方法就是使用用link引入放置在
<head>标签内，js放页面底部。
3.async和defer的作用是什么？有什么区别
-
async和defer作用是可以异步加载外部js，可以在文档元素加载的同时也同步加载js，如果没加其中一个属性，浏览器会加载到js就会立即执行，不会等待后续文档元素的加载。 -
两者相同之处就是在下载的时候都是异步，而区别在于，
async是只要加载完成之后就执行 不按照顺序。defer是会等到文档元素全部加载完成之后在执行，而且按放置顺序（貌似实际中也是不按顺序）。
4.简述网页的渲染机制
- 首先解析标签和css样式
- 构建DOM树和CSSOM树
- 然后两者合并构建渲染树
- 再则根据渲染树进行布局 计算每个节点的几何结构
- 最后浏览器再根据计算的几何结构绘制出来
render-tree-construction.png
5.JavaScript 定义了几种数据类型? 哪些是简单类型?哪些是复杂类型?
JavaScript定义了六种数据类型-
Null空对象指针，表示此处应有值，但现在是空的 -
Undefind表示未定义或不存在，只有undefind这一个值 -
Number数字，整数或者小数 -
Boolean布尔值，true和false -
String字符串 -
Object对象，各种值的组成的集合
前面五种都是简单类型。
object属于复杂类型
6.NaN、undefined、null分别代表什么?
-
NaN（not a number）表示非数字类型 -
undefined表示未赋值，已经声明但缺少值 -
null表示空值，此处应该有值，但现在是空的
7.typeof和instanceof的作用和区别?
-
typeof：判断数据的类型。 -
instanceof:判断某个对象是不是另外一个对象的实例。
8.代码
1.完成如下代码判断一个变量是否是数字、字符串、布尔、函数 （难度*）
function isNumber(el){
return typeof el ==="number"
}
function isString(el){
return typeof el ==="string"
}
function isBoolean(el){
return typeof el ==="boolean"
}
function isFunction(el){
return typeof el ==="function"
}
var a = 2,
b = "jirengu",
c = false;
alert( isNumber(a) ); //true
alert( isString(a) ); //false
alert( isString(b) ); //true
alert( isBoolean(c) ); //true
alert( isFunction(a)); //false
alert( isFunction( isNumber ) ); //true
2.以下代码的输出结果是?（难度**）
console.log(1+1); //2 数字
console.log("2"+"4"); //"24" 字符串
console.log(2+"4"); //"24" 字符串
console.log(+new Date());//1476608890023 数字
console.log(+"4");//4 数字
3.以下代码的输出结果是? （难度***）
var a = 1;
a+++a; //a++ 先运算再+a 结果：3
typeof a+2; //typeofa 先运算 结果："number2"
4.遍历数组，把数组里的打印数组每一项的平方 （难度**）
var arr = [3,4,5] // todo..// 输出 9, 16, 25
var arr = [3,4,5]
for (var i = 0; i < arr.length; i++){
console.log(arr[i]*arr[i])
}
5.遍历 JSON, 打印里面的值 （难度**）
var obj = {
name: 'hunger',
sex: 'male',
age: 28
}
//todo ...
// 输出 name: hunger, sex: male, age:28
for(var prop in obj){
console.log(prop+':'+obj[prop]);
}
6.下面代码的输出是? 为什么 （难度***）
console.log(a);//undefined //变量提升了，var a实际位置已经到了前面，但由于值还在后面，所以返回undefined
var a = 1;
console.log(a); // 1 //前面a变量已经被赋值1，所以返回1
console.log(b); //b is not defined(…) //变量b 未被声明所以报错
本篇文章版权归咸鱼和饥人谷所有，转载须说明来源
