JS语法

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

尽量将CSS link标签放在html文档靠前位置。JS代码放在html文档底部，body结束标签前

---

2.解释白屏和FOUC

如果将CSS样式放在html最后面时，根据浏览器渲染机制不同可能会出现白屏、无样式内容闪烁FOUC的情况。白屏是浏览器等待DOM和CSSOM全加载完成后再渲染的时间延迟产生（IE有这种情况），import导入CSS样式，即便放在首部区域，也会有白屏现象。无样式闪烁（IE、firefox都有）是浏览器边加载边执行，逐步加载无样式的内容,等CSS加载后页面突然展现样式。
JS代码放在HTML文档底部的原因是：脚本加载需要时间，会阻塞后面内容的展现；页面某些功能依赖js，如果JS放最前面，先加载js，页面上某些功能区的样式可能还没渲染时JS就执行了。
js禁止并发加载，因为有先后关系所以只能顺序加载，CSS样式可并发加载。

---

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

同步就是顺序执行，执行完一个再执行下一个，需要等待、协调运行。异步就是彼此独立,在等待某事件的过程中继续做自己的事，不需要等待这一事件完成后再工作。
加载异步有async和defer两种
<script></script> 没有defer或async js代码立即加载并执行，后续渲染元素等待。
<script async></script> js加载并执行与渲染后续文档并发执行（异步）。是无顺序的。
<script defer></script> js加载暂不执行，加载过程与渲染后续文档并发执行（异步），但js执行需要在所有元素解析完成后进行。有顺序的。

---

4.简述网页的渲染机制

解析HTML构建DOM树，解析CSS构建CSSOM树，把DOM、CSSOM组合成渲染树（render tree）,在渲染树基础上计算几何机构，绘制到屏幕。

---

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

6种数据类型：null,undefined,number,string,boolean,object。复杂类型是指object，可由多个简单类型的值的合成，可以看作是一个存放各种值的容器。简单类型指number,string,boolean。特殊类型指null,undefined。

---

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

NaN not a number,非数字，NaN和任何值都不等，包括NaN自己。NaN = = NaN //false .
null是一个表示"无"的对象，类型转换是转为数值0。空指针,不存在任何东西。只有一个值：null.
undefined是一个表示"无"的原始值，类型转换时转为NaN。变量被声明但没初始化，有指针但没指向任何空间。只有一个值：undefined。
null是对象类型（历史原因定义为对象类型，本质上属于undefined），NaN 是数值类型。

---

7.typeof和instanceof的作用和区别?

typeof作用是检测变量的数据类型。数值、字符串、布尔值分别返回number、string、boolean，函数返回function，undefined返回undefined，null返回object(兼容以前的代码，历史问题定义为对象类型)，除此之外的其他情况全都返回object。
typeof可以用来检测一个没有声明的变量，而不报错。

Paste_Image.png

instanceof运算符返回一个布尔值，表示指定对象是否为某个构造函数的实例。

---

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

function isNumber(el){
    if (typeof(el)==="number"){
      return true;
    } else{
      return false;
    }
};

function isString(el){
    if (typeof(el)==="string"){
      return true;
    } else{
      return false;
    }
};

function isBoolean(el){
    if(typeof(el)==="boolean"){
      return true;
    } else {
      return false;
    }
}

function isFunction(el){
    if(typeof(el)==="function"){
      return true;
    } else{
      return false;
    }
}

undefined
var a = 2,
    b = "jirengu",
    c = false;

alert( isNumber(a) );
alert( isString(a) ); 
alert( isString(b) ); 
alert( isBoolean(c) ); 
alert( isFunction(a));
alert( isFunction( isNumber ) ); 

---

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

console.log(1+1);    //2 数值直接相加
console.log("2"+"4");  //"24"  +会将两个字符串拼接
console.log(2+"4");   //"24"  一个数值一个字符串也会被拼接
console.log(+new Date());  //1473494481714 
console.log(+"4");  //4  一个字符串时会转换成数值

---

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

var a = 1;
a+++a;   //结果为3即(a++)+a
typeof a+2;  //结果为 "number2"  typeof a的结果是"number"  "number"+2 即为"number2"

---

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

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

for(var i=0;i<arr.length;i++){
console.log(arr[i]*arr[i])
}

---

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

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

for(var i in obj){
console.log(obj[i]);
}

---

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

console.log(a);  //undefined   var a变量提升，此时a未赋值，所以是undefined
var a = 1;
console.log(a);  //1    上面var a=1 所以这里a等于1
console.log(b);  //b is not defined   b是没有被定义的变量

---