视频1 视频21 视频41 视频61 视频文章1 视频文章21 视频文章41 视频文章61 推荐1 推荐3 推荐5 推荐7 推荐9 推荐11 推荐13 推荐15 推荐17 推荐19 推荐21 推荐23 推荐25 推荐27 推荐29 推荐31 推荐33 推荐35 推荐37 推荐39 推荐41 推荐43 推荐45 推荐47 推荐49 关键词1 关键词101 关键词201 关键词301 关键词401 关键词501 关键词601 关键词701 关键词801 关键词901 关键词1001 关键词1101 关键词1201 关键词1301 关键词1401 关键词1501 关键词1601 关键词1701 关键词1801 关键词1901 视频扩展1 视频扩展6 视频扩展11 视频扩展16 文章1 文章201 文章401 文章601 文章801 文章1001 资讯1 资讯501 资讯1001 资讯1501 标签1 标签501 标签1001 关键词1 关键词501 关键词1001 关键词1501 专题2001
一些关于JS的基础问题
2020-11-27 19:48:30 责编:小采
文档
 在开发学习中经常会遇到一些js问题,本篇将会介绍一些相关的js基础问题。

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

一般我们把CSS放在head头部标签中,把JS代码放在body代码的尾部。

<!DOCTYPE html><html><head>
 <meta charset="utf-8">
 <title>JS基础</title>
 <style>
 
 /* 这里放css代码 */ 
 
 </style></head><body>
 <!-- 这里放HTML代码 -->
 
 <script>

<!-- 这里放JS代码 -->

</script></body></html>

解释白屏和FOUC

白屏 :如果把CSS样式放在底部,在某些场景下(新窗口打开、刷新等)页面会出现白屏,而不是内容逐步展现,如果使用@import标签,即时CSS放入link,并且放在头部,也可能出现白屏现象。

脚步会阻塞后面内容的展现

脚本会阻塞其后组建的下载
对于图片和CSS,在加载时会并发加载(如一个域名下同时加载两个文件),但在加载JS时,会禁用并发,并且阻止其它内容的下载,所以把JS放到页面的顶部也会出现白屏的现象。

FOUC(Flash of Unstyled Content)无样式内容闪烁 :如果把CSS样式放在底部,对于IE浏览器,在某些场景下(点击链接,输入URL,使用书签进入等),就会出现FOUC现象(逐步加载无样式的内容,等CSS加载后页面突然展现样式),对于Firefox会一直出现FOUC现象。

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

没有async和defer,在浏览器加载中会立即加载执行当前的脚本,并阻塞浏览器渲染script标签之下的文档元素,而有了async和defer可以使浏览器加载渲染后续文档的过程和JS脚本的加载与执行并行进行,也就是加载异步。

两者的区别:主要是脚本下载完成之后何时执行,defer会按照加载顺序脚本延迟到文档解析显示后执行,而async不管你声明的顺序如何,只要他加载完了就会立刻执行,并不会按照顺序。
一般来说defer更符合我们的使用场景。

网页的渲染机制

解析 HTML 标签, 构建 DOM 树

解析 CSS 标签, 构建 CSSOM 树

根据 DOM 和 CSSOM 组合成 渲染树 (render tree)进行基础布局

计算每个节点的几何结构

把每个节点绘制到屏幕上 呈现给用户

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

Null :是空指针

Underfined :有指针但未指向任何空间

Boolean :布尔值,真假(true,false)

Number :数字类型。

String :字符串类型,单引号或双引号表示。

Object :对象,JS核心概念,最重要的数据类型。(一切皆为对象)

前5种为简单类型,Object为复杂类型。

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

NaN:含义是Not a number,表示非数字,与任何值都不相等,包括他自己,(一种不等于任何值的数字类型)

underfined:是Underfined唯一的值,表示变量只是被声明,但是没有初始化,代表有这个指针,但是此指针没有指向任何空间

null:Null唯一的值,表示空指针,也就是不存在的东西

typeof和instanceof的作用和区别?

typeof的作用,可以判断返回一个值的数据类型,放在运算数的前面,运算数可以是任何类型。

function a(){}
a(){}typeof a"function" //运算数为函数返回functiontypeof 123421"number"typeof "32423423423""string"typeof true"boolean" typeof undefined"undefined" //利用这一点检查未定义变量typeof window"object" //其他全部返回object

instanceof 用于判断一个变量是否某个对象的实例,因为typeof遇到null,数组,对象时都会返回object类型,所以当我们要判断一个对象是否是数组时,或者判断某个变量是否是某个对象的实例则要选择使用instanceof

代码问题

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;alert( isNumber(a) ); //truealert( isString(a) ); //falsealert( isString(b) ); //truealert( isBoolean(c) ); //truealert( isFunction(a)); //falsealert( isFunction( isNumber ) ); //true

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

我是图

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

var a = 1;
a+++a;typeof a+2;

结果为number2,(typeof优先级相当高,所以优先计算typeof a结果为number,带上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);var a = 1;console.log(a);console.log(b);

第一个console.log(a);输出为underfined,因为JS会全局变量提升,a只有声明没有赋值。
第二个console.log(a);输出为1,因为它在var a =1;之后,1赋值到a身上。
第三个console.log(b);输出会报错,因为b未声明未赋值。

本篇介绍了一些介绍基础问题,想要更多相关知识请关注Gxl网。

下载本文
显示全文
专题