JS语法

CSS和JS在网页中的放置顺序是怎样的？

1. 对于CSS，应该使用标签放在标签内，当直接写在html文档中时应该在标签内写一个
2. 对于JS通常放在的内容的最后面，但是个别特殊JS内容应该尽量放在最前面。

  /*外部引用*/

  

    /*内部引用*/

    

解释白屏和FOUC

1. 白屏问题：如果把样式放在底部，对于IE浏览器，在某些场景下页面会出现白屏，而不是内容逐步展现，如果使用@import标签，即使CSS放入并且放在头部也可能出现白屏。
   在加载JS文件时，会警用并发，并阻止其他内容的下载，所以把JS放入页面顶部也会导致白屏现象。
2. FOUC无样式内容闪烁
   如果把样式放在底部,对于IE浏览器,在某些场景下(点击链接,输入URL,使用书签进入等),会出现 FOUC 现象(逐步加载无样式的内容,等CSS加载后页面突然展现样式).对于 Firefox 会一直表现出 FOUC .

将JS放在底部

• 脚本会阻塞后面内容的呈现
• 脚本会阻塞其后组建的下载

async和defer的作用是什么？有什么区别

async和defer都时异步加载。
没有defer或async，浏览器会立即加载并执行指定的脚本，立即指的是在渲染该

2. 有defer，加载后续文档元素的过程将和script.js的加载并行进行，但 script.js 的执行要在所有元素解析完成之后，DOMContentLoaded 事件触发之前完成。

defer和async的区别：

1. defer：脚本延迟到文档解析和显示后执行，有顺序
2. async：不保证顺序

简述网页的渲染机制

1. 浏览器打开页面时，先加载HTML的内容，然后解析HTML文件解析成DOM树。
2. 解析CSS构建CSSOM树
3. 把DOM和CSSOM组合成渲染树
4. 在渲染树的基础上进行布局，计算每个节点的几何结构
5. 把每个节点绘制到屏幕上

JavaScript 定义了几种数据类型? 哪些是简单类型?哪些是复杂类型?

• 简单类型
  1. Number类型：整数和小数
  2. String类型：字符组成的文本
  3. Boolean类型：true和false的两个特定值
  4. Null：表示已经定义了一个变量，但是目前没有赋值，即为空
  5. Undefined类型：表示未定义或不存在
• 复杂类型
  Object类型

NaN、undefined、null分别代表什么?

1. NaN表示非数字，但是属于Number类型。NaN和任何数值都不相等，包括它自己
2. undefined表示不存在值，就是此处目前不存在任何值。典型用法：

• 变量被声明了，但没有赋值时，就等于undefined
• 调用函数时，应该提供的参数没有提供，该参数等于undefined
• 对象没有复制的属性，该属性的值为undefined
• 函数没有返回值时，默认返回undefined

3. null表示空值，即该处现在为空，用法：

• 作为函数的参数，表示该函数的参数是一个没有任何内容的对象
• 作为对象原型链的终点

typeof和instanceof的作用和区别?

typeof和instanceof都能用来判断变量的类型或者是否为空。

• typeof用以获取一个变量的类型，一半只能返回number,boolean,string,function,object,undefined类型。

• 而instaceof用来判断一个变量是否是某个对象的实例，返回值是布尔类型，已确定该变量是否为指定类型。

代码

1. 完成如下代码判断一个变量是否是数字、字符串、布尔、函数

function isNumber(el){
}
function isString(el){
}
function isBoolean(el){
}
function isFunction(el){
}
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());  //1470814913028
console.log(+"4");            //4

3. 以下代码的输出结果是?

var a = 1;
a+++a;    //3
typeof a+2;    //number2

4. 遍历数组，把数组里的打印数组每一项的平方

var arr = [3,4,5]
// todo..
// 输出 9, 16, 25 

代码预览

5. 遍历 JSON, 打印里面的值

var obj = {
  name: 'hunger',
  sex: 'male',
  age: 28
}
//todo ...
// 输出 name: hunger, sex: male, age:28

代码预览

6. 下面代码的输出是? 为什么

console.log(a);//undefined 变量提升 a未赋值
var a = 1;
console.log(a); //1
console.log(b); //b is undefined,未声明b

本文版权归本人和饥人谷所有，转载请注明来源。