预热:
** javascript引入方式:**
- a、在head或者body中,引入script标签
<script>
alert(1);
</script> - b、引入js文件,js文件里写js代码
<script type="text/javascript" src="program.js"></script>
** 标签的位置,放在body内的最下位置。区别css位置 *
** 基本调试:**
a、审查元素,打开控制台;
b、alert();
c、console.log();
** 数据类型:**
简单类型:
数字 number
字符串 string
布尔 boolean
undefined
null
复杂类型:对象
对象又可以分成三个子类型:
侠义的对象(object)
数组(array)
函数(function)
- typeof运算符:
javascript有三种方法,可以确定一个值到底是什么类型。
typeof 运算符
返回一个值得数据类型。(利用这一点,可以用来检查一个没有声明的变量,而不报错。)
instanceof 运算符
判断变量是否为给定的引用类型。
object.prototype.toString()方法
**** 1、CSS和JS在网页中的放置顺序是怎样的? ****
css放在head标签中;
js放在body标签的尾部,区别于css位置。
**** 2、解释白屏和FOUC ****
如果把样式放在底部,对于IE浏览器,在某些场景下(新窗口打开,刷新等)页面会出现白屏,而不是内容逐步展现。
如果使用 @import 标签,即使 CSS 放入 link, 并且放在头部,也可能出现白屏 。
FOUC (Flash of Unstyled Content) 无样式内容闪烁
如果把样式放在底部,对于IE浏览器,在某些场景下(点击链接,输入URL,使用书签进入等),会出现 FOUC 现象(逐步加载无样式的内容,等CSS加载后页面突然展现样式).对于 Firefox 会一直表现出 FOUC .
将JS放在底部
脚本会阻塞后面内容的呈现
脚本会阻塞其后组件的下载
对于图片和CSS, 在加载时会并发加载(如一个域名下同时加载两个文件). 但在加载 JavaScript 时,会禁用并发,并且阻止其他内容的下载. 所以把 JavaScript 放入页面顶部也会导致 白屏 现象.
**** 3、async和defer的作用是什么?有什么区别 ****
一般而言,浏览器在加载页面的时候,碰见script脚本会优先加载脚本,当脚本加载完毕后才会继续加载其他内容,async和defer就是为了解决此类问题的。
async:延迟加载,在加载脚本时会并行加载和渲染后续文档元素,但不会保证顺序。
defer:异步加载,在加载脚本时会并行加载和渲染后续文档元素,但会在所有元素解析完成之后,DOMContentLoaded事件触发之前才会执行脚本。
**** 4、简述网页的渲染机制 ****
解析 HTML 标签, 构建 DOM 树
解析 CSS 标签, 构建 CSSOM 树
把 DOM 和 CSSOM 组合成 渲染树 (render tree)
在渲染树的基础上进行布局, 计算每个节点的几何结构
把每个节点绘制到屏幕上 (painting)
**** 5、JavaScript 定义了几种数据类型? 哪些是简单类型?哪些是复杂类型? ****
- 数据类型:
简单类型
数字 number
字符串 string
布尔 boolean
undefined
null - 复杂类型:对象
对象又可以分成三个子类型:
侠义的对象(object)
数组(array)
函数(function)
**** 6、NaN、undefined、null分别代表什么? ****
ull表示空值,即该处的值现在为空。典型用法是:
作为函数的参数,表示该函数的参数是一个没有任何内容的对象。
作为对象原型链的终点。
undefined表示不存在值,就是此处目前不存在任何值。典型用法是:
变量被声明了,但没有赋值时,就等于undefined。
调用函数时,应该提供的参数没有提供,该参数等于undefined。
对象没有赋值的属性,该属性的值为undefined。
函数没有返回值时,默认返回undefined。
NaN:表示非数字。NaN和任何值都不相等,包括自己。
NaN == NaN; //false
**** 7、typeof和instanceof的作用和区别? ****
- js有三种方法,可以确定一个值是什么类型。
1.typeof 运算符
2.instanceof 运算符
3.object.prototype.toString()方法
typeof:返回一个值的数据类型instanceof:判断变量是否为 给定的引用类型比如:typeof对数组和对象的显示结果都是object,怎么区分呢?instanceof运算符可以做到
var o = {};var a = [];o instanceof Array //falsea instanceof Array //true
8、以下代码的输出结果是?
console.log(2+4); //6 数字类型相加
console.log("2"+"4"); //"24" 字符串拼接
console.log(2+"4"); //"24" 任何与字符串相加都会变成字符串
console.log(2+new Date()); //"2Mon Jan 20 2014 17:15:01 GMT+0800 (China Standard Time)" 对象使用valueof方法转换为数字
// 在参数有对象的情况下会调用其valueOf或toString
console.log(+"4"); //4 转换为整数
// 在只有一个数字参数的时候返回其正数值
javascript常用代码大全 1
javascript常用代码大全 2
javascript常用代码大全 3
javascript常用代码大全 4 函数库