JavaScript初次见面

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

CSS在网页中应当靠前放置,一般放置在head标签内,使用link标签引入。在加载body内容之前就加载完成css,可以有效避免浏览器的白屏问题和无样式闪烁(FOUC)问题。
JS脚本一般放置在body标签的最后面。这样设置的原因一方面是在加载执行JS的时候,一般情况下会阻塞页面的渲染;另一方面是防止需要操作DOM的JS不会因为DOM还没加载完成而出现错误。

解释白屏和FOUC

白屏和无样式内容闪烁(FOUC)问题,本质上是浏览器对于无样式内容进行渲染上存在的问题。
在浏览器还没有得到样式css的时候,在某些情况下,即使已经收到内容,但对于无样式内容不进行渲染,就出现了所谓的白屏问题。
无样式内容闪烁的存在是因为,浏览器已经渲染了收到的无样式内容,这时候突然收到了样式,然后对页面进行一个重新渲染的过程,之前的页面突然呈现出样式,给人的感觉像是突然闪了一下。

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

async和defer都作用于JavaScript脚本的加载,同时使得JS的加载异步,不阻塞页面的的渲染。区别是async使得JS下载完成后立刻执行,而defer是在JS下载完成后,在页面渲染完成之后进行执行。使用async下载的JS,先下载完成的先执行,而defer是在渲染完成后依照先后顺序进行执行。
使用时写在script标签内:

 <script async src="script.js"></script>
 <script defer src="script.js"></script>

简述网页的渲染机制

渲染引擎处理网页,通常分成四个阶段。

  • 解析代码:HTML代码解析为DOM,CSS代码解析为CSSOM(CSS Object Model)
  • 对象合成:将DOM和CSSOM合成一棵渲染树(render tree)
  • 布局:计算出渲染树的布局(layout)
  • 绘制:将渲染树绘制到屏幕

这四部并不是严格的顺序执行的,页面会希望用户尽早看到内容,所以会出现什么都没加载完毕,浏览器将已经下载的内容先呈现在了页面上。

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

在ES6之前,JavaScript定义了六种数据类型。

数值(number):整数和小数(比如1和3.14)
字符串(string):字符组成的文本(比如”Hello World”)
布尔值(boolean):true(真)和false(假)两个特定值
undefined:表示“未定义”或不存在,即此处目前没有任何值
null:表示空缺,即此处应该有一个值,但目前为空
对象(object):各种值组成的集合

数值、字符串、布尔值成为简单类型(primitive type),是基本的数据类型、将对象称作复杂类型(complex type),因为对象大多是多个原始类型的组合。undefined和null是JS中比较特殊的值,都代表了“没有”。

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

NaN的意思是 Not a Number,表示这不是一个数字。可能是除了数字以外的任何东西,所以它也不和自己相等。
Undefined与null意义非常接近,在if语句中都代表false,undefined == null 结果也为true。区别在于,null是属于对象的,typeof null的结果是 “object”,在理解上,null表示空值,而undefined表示未定义。

typeof和instanceof的作用和区别?

typeof 一元运算符,它用来判断一个值的数据类型是什么;而instanceof用来判断一个实例是否属于一个对象。

代码


完成如下代码判断一个变量是否是数字、字符串、布尔、函数 (难度*)

function isNumber(el){
    return typeof(el)==="number";
}
function isString(el){ 
    return typeof(el)==="string";
}
function isBoolean(el){
    return typeof(el)==="boolean";
}
function isFunction(el){
    return typeof(el)==="object";
}

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

console.log(1+1); //2,数字相加返回数学结果
console.log("2"+"4"); //"24", 字符串相加返回字符串拼接结果
console.log(2+"4");// "24", 有一方是字符串的时候, 另一方会转化为字符串进行拼接
console.log(+new Date());//  在参数有对象的情况下会调用其valueOf或toString
console.log(+"4"); // 4, 只有右侧有数字或字符串, 且在字符串为十进制数时,返回 (+/-)+数字 结果

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

var a = 1;
a+++a; // 3 
//相当于 (a++)+a, 左侧的a先作为1 参与加法运算
//之后执行自加, 加法后面的a 作为自加之后的结果2 参与加法运算,所以结果为3 

typeof a+2; //"number2" ,typeof的优先级相对加法要高, 此时会先执行(typeof a), 再执行+2 运算

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

var arr = [3,4,5];

for(var x in arr){
  console.log(arr[x]*arr[x]);
}
// 输出 9, 16, 25 

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

var obj = { 
  name: 'hunger',
  sex: 'male', 
  age: 28
}

for(var x in obj){
  console.log(x,":",obj[x]);
}

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

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

console.log(a);//不会报错,提示undefined
var a = 1;
console.log(a);// 1
console.log(b);// 报错
//实际运行过程中, 会有变量提升的问题
//var a; 语句将会在程序运行一开始就执行, 但不会进行赋值, 所以会提示 undefined. 

部分引用自 阮一峰JS教程
本教程版权归 张宇 和 饥人谷 所有,转载须说明来源

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,519评论 5 468
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,842评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,544评论 0 330
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,742评论 1 271
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,646评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,027评论 1 275
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,513评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,169评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,324评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,268评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,299评论 1 329
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,996评论 3 315
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,591评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,667评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,911评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,288评论 2 345
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,871评论 2 341

推荐阅读更多精彩内容

  • 在线阅读 http://interview.poetries.top[http://interview.poetr...
    程序员poetry阅读 114,200评论 24 450
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,721评论 1 92
  • 前端开发面试知识点大纲: HTML&CSS: 对Web标准的理解、浏览器内核差异、兼容性、hack、CSS基本功:...
    秀才JaneBook阅读 2,322评论 0 25
  • <a name='html'>HTML</a> Doctype作用?标准模式与兼容模式各有什么区别? (1)、<...
    clark124阅读 3,452评论 1 19
  • 西鄙人《哥舒歌》原诗、注释、翻译、赏析 【原文】:哥舒歌北斗七星高,哥舒夜带刀。至今窥牧马,不敢过临洮。 【注释】...
    xcy无名阅读 393评论 0 0