js语法

作者: 饥人谷区子铭 | 来源:发表于2016-09-21 18:32 被阅读0次

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

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

    2.解释白屏和FOUC

    (1)当js文件放在文本的顶部会造成以下两种情况

         1.1脚本会阻塞后面内容的呈现

         1.2脚本会阻塞其后组件的下载

    (2)白屏

    2.1在 Google Chrome 浏览器中,渲染会等到CSS加载完成后才开始。如果 CSS 文件没有放在页面头部,而是中间的位置,那么在加载 CSS 文件之前的时间段内,页面会呈现出白屏现象。

    2.2如果使用@import标签,即使 CSS 放入link标签中,并且放在头部,也可能出现白屏现象。

    2.3如果 JS 文件放到文件开始,也会因为等待加载和执行 JS 文件而导致后面的文档元素加载被阻断,页面呈现白屏。

    (3)FOUC(Flash of Unstyled Content,无样式内容闪烁)现象。

    3.1所谓的无样式闪烁(IE、firefox都有)是浏览器边加载边执行,逐步加载无样式的内容,等CSS加载后页面突然展现样式。

    3.2FOUC现象主要体现在firefox浏览器下,firefox为了增强用户体验,选择在加载样式的同时绘制树,导致用户在加载页面的同时会看到渲染绘制的过程,也就出现了FOUC现象。

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

    (1)一般情况可不加上async/defer,若加上如这样<script async/defer src=""></script>

    (2)假设一定想把js文件放顶部,就得加上defer和async来异步加载

    (3)如果不加[async]和[defer],浏览器读到script里的脚本就马上加载并且执行,不会去等后续渲染元素

    (4)<script async></script>js加载并执行与渲染后续文档并发执行(异步),当时不保证顺序

    (5)<script defer></script>js加载后暂不执行,脚本延迟到文档解析和显示后才执行,有顺序之分

    4.简述网页的渲染机制

    步骤一:解析HTML,构建DOM树

    步骤二:解析CSS,构建CSSOM树

    步骤三:把DOM、CSSOM组合成渲染树(render tree)

    步骤四:在渲染树基础上进行布局,把每一个节点绘制到屏幕上。

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

    简单类型:Null、undefined、Boolean、Number、String      复杂类型:Object

    Null:空指针,也就是不存在的东西

    undefined:表示变量只是被声明,没有被初始化,有指针,但是不指向任何空间

    Boolean:布尔值,只有true和false之分

    Number:数字 var a=1,b=0.2,c=1e10

    String:Unicode 字符组成的序列,俗称字符串,可以用单引号或者双引号表示。   字符串有一些转义字符。  var str =“ ”

    Object对象 :对象是 JavaScript 的核心概念

    复杂类型又分为:  function 函数       Array 数组      Data日期

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

    (1)NaN表示JS的特殊值,表示“非数字”(Not a Nember); NaN不是一种独立的数据类型;

            NaN === NaN //false

    (2)undefined本身自成一个数据类型。表示“缺少值”,就是此处应该有一个值,但是还没有定义。

           2.1声明变量后,如果没有给变量赋值,那么变量值等于undefined。

           2.2调用函数时,如果没有给函数提供应有的参数,那么参数值默认为undefined。

           2.3对象的属性没有进行赋值,那么该属性的值为undefined。

           2.4函数没有返回值时,默认返回undefined。

    (3)null本身也自成一个数据类型。表示“没有对象”,即该处不应该有值。

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

    (1)typeof是检测简单类型及function检测,但是遇到null无效,null还是要用===        typeof(1)//Number       

    typeof(“str”)//string                 

    typeof(true)//boolean 

    typeof([1,2])//Object   

     typeof (new Object()) //Object       

     typeof (null)  //Object

    (2)instanceof 常用作判断对象类型                                                                              

    obj(对象)  instanceof  Object(构造系)                                                                        

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

    eg:[1,2] instanceof Array === true                                                                          

    eg: new Object() instanceof Array === false

    8.代码

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

    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

    }

    }

    var a = 2,

    b = "jirengu",

    c = false;

    console.log( isNumber(a) );  //true

    console.log( isString(a) );  //false

    console.log( isString(b) );  //true

    console.log( isBoolean(c) ); //true

    console.log( isFunction(a)); //false

    console.log( isFunction( isNumber ) ); //true

    2.以下代码的输出结果是?(难度**)

    console.log(1+1);  //2   两个数相加,输出数值

    console.log("2"+"4");//24  字符串相加等同于拼接,输出字符

    console.log(2+"4");//24  一个数字和字符串相加等同于拼接字符串,输出字符

    console.log(+newDate());//1474442366638距离1997年1月1日的毫秒数

    console.log(+"4");//4      4"转化为数值,最后结果为数值

    3.以下代码的输出结果是? (难度***)

    var a = 1;

    console.log(a+++a);//2

    typeofa+2; //number+2

    分析:在a+++a表达式当中,后置递增的优先级最高。所以相当于(a++)+a。a一开始赋值为1,a++表示先赋值再自增,所以a++的计算结果为1,且此时a等于2。所以a+++a表达式的计算结果为3。

    分析:而typeof a+2中,typeof在js中的优先级比“+”高,所以它会先计算typeof a,得到的输出是字符串"number"。然后是一个字符串加上一个数字,会把数字转换成字符串。所以得到的输出为"number2"的字符串

    4.遍历数组,把数组里的打印数组每一项的平方 (难度**)

    5,遍历 JSON, 打印里面的值 (难度**)

    varobj = { name:'hunger',                                                                                                          

     sex:'male',                                                                                                                                  

    age:28}                                                                                                                                     

      //todo ...// 输出 name: hunger, sex: male, age:28

    6.下面代码的输出是? 为什么 (难度***)

    console.log(a); //undefined                                                                                                             

     var  a =1;                                                                                                                                 

    console.log(a);//1                                                                                                          

    console.log(b);//is not defined

    分析:过程如下

     var a                                                                                                                                           

    console.log(a)                                                                                                                                      

     a=1                                                                                                                                       

    consolo.log(a)                                                                                                                   

     console.log(b)

    由于变量会提升,但还赋值,所以第一个输出为undefined

    第二个则会显示为1

    第三个由于没有声明变量b,所以会报错

    相关文章

      网友评论

          本文标题:js语法

          本文链接:https://www.haomeiwen.com/subject/rgmaettx.html