前端常见面试题(十三)@郝晨光


列举三种强制类型转换和两种隐式类型转换

JavaScript是一门弱类型语言,在JavaScript中声明变量不需指定类型, 对变量赋值也没有类型检查,同时JavaScript允许隐式类型转换。

强制类型转换

通过String()toString()Number()parseInt()parseFloat()Boolean()等函数强制转换

Boolean(0) // => false - Boolean 
Boolean(new object()) // => true - Boolean 
Number(undefined) // => NaN - Number
Number(null) // => 0  - Number
String(null) // => “null” - String
5.toString() // => ‘5’ - String
parseInt('5') // => 5 - Number
隐式类型转换
  1. 数学运算符+、-、*、/、%
    • 	let a = '5';
      	let b = 'a';
      	let c = 5;
      	console.log(a%5); // => 0 - Number
      	console.log(a/5); // => 1 - Number
      	console.log(a*5); // => 25 - Number
      	console.log(a-5); // => 0 - Number
      	console.log(a+'5'); // => '55' - String
        	console.log(b/5); // => NaN - Number
        	console.log(c+5); // => 10 - Number
      	console.log(c+true); // => 6 - Number
      
    • 需要注意的是+号在进行隐式转换的时候,如果在任何一边有字符串的话,会当做拼接字符串来处理,而如果是布尔值的话:true == 1;false == 0;
  2. 布尔操作符==
    • 在使用布尔操作符==的时候,会对等号两边的数据进行类型转换对比
    • undefined等于null
    • 字符串和数字比较时,字符串转数字
    • 数字为布尔比较时,布尔转数字
    • 字符串和布尔比较时,两者转数字
  3. 判断语句if、while
    • 在使用判断语句的时候,括号内的表达式会被转换布尔值
    •   var obj = {}; 
        if(obj){ 
            while(obj); 
        } 
      
  4. 调用浏览器环境的方法,如:alert 会将数据转换为String


JavaScript typeof返回哪些数据类型

  1. number
  2. string
  3. boolean
  4. undefined
  5. symbol
  6. object typeof null === ‘object’
  7. function


window.onload 和document.ready的区别

document.ready和onload的区别为:加载程度不同、执行次数不同、执行速度不同。

一、加载程度不同
  1. document.ready:在DOM加载完成后就可以可以对DOM进行操作。一般情况一个页面响应加载的顺序是,域名解析-加载html-加载js和css-加载图片等其他信息。那么Dom Ready应该在“加载js和css”和“加载图片等其他信息”之间,就可以操作Dom了。
  2. onload:在document文档加载完成后就可以可以对DOM进行操作,document文档包括了加载图片等其他信息。那么Dom Load就是在页面响应加载的顺序中的“加载图片等其他信息”之后,就可以操作Dom了。
二、执行次数不同
  1. document.ready可以写多个.ready,可以执行多次,第N次都不会被上一次覆盖。
  2. onload只能执行一次,如果有多个,那么第一次的执行会被覆盖。
三、执行速度不同
  1. onload除了要等待DOM被创建还要等到包括大型图片、音频、视频在内的所有外部资源都完全加载。如果加载图片和媒体内容花费了大量时间,用户就会感受到定义在onload事件上的代码在执行时有明显的延迟。
  2. document.ready函数只需对 DOM 树的等待,而无需对图像或外部资源加载的等待,从而执行起来更快。


== 和 ===的区别

===是严格等于,必须是等号两边的值完全相等,数据类型也完全相等的时候才相等、==是非严格等于,会先对等式两边进行隐式类型转换,然后再进行对比

==非严格等于的类型转换
  1. 如果两个值类型相同,进行 === 比较。
  2. 如果两个值类型不同,他们可能相等。根据下面规则进行类型转换再比较:
    • 如果一个是null、一个是undefined,那么相等。
    • 如果一个是字符串,一个是数值,把字符串转换成数值再进行比较。
    • 如果任一值是 true,把它转换成 1 再比较;如果任一值是 false,把它转换成 0 再比较。
    • 如果一个是对象,另一个是数值或字符串,把对象转换成基础类型的值再比较。对象转换成基础类型,利用它的toString或者valueOf方法。js核心内置类,会尝试valueOf先于toString;例外的是Date,Date利用的是toString转换。
===严格等于
  1. 如果类型不同,就一定不相等
  2. 如果两个都是数值,并且是同一个值,那么相等;如果其中至少一个是NaN,那么不相等。(判断一个值是否是NaN,只能使用isNaN()来判断)
  3. 如果两个都是字符串,每个位置的字符都一样,那么相等,否则不相等。
  4. 如果两个值都是true,或是false,那么相等
  5. 如果两个值都引用同一个对象或是函数,那么相等,否则不相等
  6. 如果两个值都是null,或是undefined,那么相等


style标签写在body前和body后有什么区别

body后的style标签的优先级要高于body前的style标签

写在body标签后由于浏览器以逐行方式对html文档进行解析,当解析到写在尾部的样式表(外联或写在style标签)会导致浏览器停止之前的渲染,等待加载且解析样式表完成之后重新渲染,在IE浏览器下可能会出现FOUC现象(即样式失效导致的页面闪烁问题)



如果本文对您有帮助,可以看看本人的其他文章:
前端常见面试题(十二)@郝晨光
前端常见面试题(十一)@郝晨光
前端常见面试题(十)@郝晨光

结言
感谢您的查阅,本文由郝晨光整理并总结,代码冗余或者有错误的地方望不吝赐教;菜鸟一枚,请多关照
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值