美文网首页
JS入门知识

JS入门知识

作者: 谢环志 | 来源:发表于2016-08-13 11:43 被阅读0次

    一、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

    相关文章

      网友评论

          本文标题:JS入门知识

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