{JS基础}

放置顺序

  • CSS一般放置在<head>标签内
    如果css放在底部或者使用@import方式引入
    某些浏览器例如Firefox,其渲染机制是:网页加载到哪里就绘制到哪里。
    这样就出现无样式内容闪烁。这种现象称为FOUC

  • JS一般放置在</body>标签前
    如果JS放在前面的其他位置
    1 某些浏览器例如chrome,其渲染机制是:等所有的标签和样式解析完成以后,再绘制网页。
    2 加载JS会阻塞其后组件的下载,会影响其后内容的呈现。
    这样会出此现长时间白屏

如何解决白屏问题?(当JS放置在<head>标签内)
设置异步加载,即加载和渲染后面文档元素的过程将和js文件的加载和执行同时进行。
1 <script async src="script.js"></script> 加载到哪里,JS就执行到哪里。
2 <script defer src="script.js"></script> 所有元素加载完成之后,再执行JS。

渲染机制

1.浏览器解析HTML,创建DOM树;解析CSS,创建CSS树。
2.合并DOM树和CSS树,创建渲染树。
3.根据渲染树进行布局,计算每个点的几何结构。
4.根据几何结构,绘制出网页。

数据类型

原始类型 最基本,无法细分 例子
String 字符组成的文本 var myVariable = 3.14;
Number 整数和小数 var myVariable = "Hello World";
Boolean (真)和(假)两个特定值 var myVariable = true;
特殊类型 区别 用法
Undefined 目前不存在任何值 1 变量被声明了,但没有赋值
2 调用函数时,应该提供的参数没有提供
3 对象没有赋值的属性
4 函数没有返回值
Null 有一个值,但目前为空 **1 ** 作为函数的参数
** 2 ** 作为对象原型链的终点
NAN (not a number)非数字 和任何值都不相等,包括自己
合成类型 多个原始类型的值的合成 例子
Object (广义) 各种值组成的集合,</br>可以看作是一个存放各种值的容器 --
object(狭义) 数据组合方式1 ----
array 数据组合方式2 ----
function 处理数据的方法 ----

判断变量

  • type 类型
    typeof 判断一个值的数据类型
    返回类型:
    1 原始 number, boolean,string;
    2 函数 function;
    3 特殊 undefined ;(利用这一点,typeof可以用来检查一个没有声明的变量)
    4 其他 object

  • instance 实例
    instanceof 判断一个值是不是某种对象的实例
    返回类型:
    1是 则返回 ture ;
    2不是 则返回 false

本教程版权归 饥人谷_memo和饥人谷所有,转载须说明来源
本教程版权归 饥人谷_memo和饥人谷所有,转载须说明来源
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容