前端总结

Zoom 发布于2019-08-02 14:23 / 747人阅读

摘要：是一个双目运算符内部实现机制是通过原型链来判断能自定义行为的东西三类型转换转除了其他所有值都转为包括所有对象对象转原始类型对象在转换类型的时候，会调用内置的函数该方法在转原始类型时调用优先级最高。

JS基础知识

（一）JS中原始类型
(1)原始值有六种：boolean,null,undefined,number,string,symbol
(2)原始类型存储的都是值，没有函数可以调用，能够函数调用是因为进行了强制类型转换，转换成对象类型
(3)number类型为浮点型类型 eg:0.1+0.2!=0.3 string类型是不可变 string类型调用任何方法，不会改变其值
（二）JS对象类型
原始类型和对象类型的区别？

原始类型存储值，对象类型存储地址（指针）

（1）函数参数是对象的情况？
函数传参是传递对象指针的副本
（2）typeof vs instanceof
typeof是否能正确判断类型？instanceof正确判断对象的原理？

typeof对原始类型除了null都可以判断出类型对象类型除了function 其他全显示object typeof是一个一元运算符

function本质上也是一个对象，但是function对象与普通对象相比，其内部有一个[[Call]]方法，用来表示这个对象是可调用的，typeof操作
符在判断Object时，如果内部实现了[[Call]]方法,就返回function。

instanceof是一个双目运算符内部实现机制是通过原型链来判断 Symbol.hasInstance能自定义instanceof行为的东西

（三）类型转换
（1）转Boolean

除了undefined null false NaN "" 0 -0 其他所有值都转为true 包括所有对象

（2）对象转原始类型

对象在转换类型的时候，会调用内置的 [[ToPrimitive]] 函数 该方法在转原始类型时调用优先级最高。

 let a = {
     valueOf() {
    return 0
  },
  toString() {
    return "1"
  },
  [Symbol.toPrimitive]() {
    return 2
  }
}
1 + a // => 3

(3)四则运算符
加法运算符的特点：

运算中其中一方为字符串，那么就会把另一方也转换为字符串（优先转化成字符串）

如果一方不是字符串或者数字，那么会将它转换为数字或者字符串（布尔值转化为数字其他优先字符串）

除了加法运算符，其他运算符只要其中一方是数字，那么另一方就会被转为数字
比较运算符

如果是对象，就通过toPrimitive转换为对象

如果是字符串，就通过unicode字符索引来比较

（四）this
如何正确判断this?箭头函数的this是什么?
this指向哪里的优先级规则：new>bind>obj.foo()>foo() 箭头函数一旦被绑定，就不会再被任何方式所改变

（五）== vs ===
== vs === 有什么区别？
==:如果类型不同，会进行类型转换
判断一方是boolean会转化成number 再进行比较可能会继续类型转换
判断一方是object且另一方为string、number、symbol会把object转为原始类型再进行判断
（六）闭包
什么是闭包？内部函数可以访问外部函数的变量
循环中使用闭包解决‘var’定义函数的问题

for (var i = 1; i <= 5; i++) {
  setTimeout(function timer() {
    console.log(i)
  }, i * 1000)
}

setTimeout是个异步函数，会把循环全部执行完毕，i 就是6
解决办法一

for (var i = 1; i <= 5; i++) {
  (function(j) {
    setTimeout(function timer() {
      console.log(j)
    }, j * 1000)
  })(i)
}

使用了立即执行函数将 i 传入函数内部，这个时候值就被固定在了参数 j 上面不会改变，当下次执行 timer 这个闭包的时候，就可以使用外部函数的变量 j（执行上下文作用域链优先寻找最近的）

解决办法二

for (var i = 1; i <= 5; i++) {
  setTimeout(
    function timer(j) {
      console.log(j)
    },
    i * 1000,
    i
  )
}

使用 setTimeout 的第三个参数，这个参数会被当成 timer 函数的参数传入
解决办法三

for (let i = 1; i <= 5; i++) {
  setTimeout(function timer() {
    console.log(i)
  }, i * 1000)
}

使用 let 定义 i 了来解决问题了
（七）深浅拷贝
什么是浅拷贝？如何实现浅拷贝？什么是深拷贝？如何实现深拷贝？
Object.assign浅拷贝只会拷贝所有的属性值到新的对象中，如果属性值是对象，拷贝的是地址
通过展开运算符...同样实现浅拷贝
浅拷贝只解决第一层的问题
深拷贝：通过JSON.parse(JSON.stringify(object))
局限性：会忽略undefined,symbol,不能序列化函数，不能解决循环引用的对象
lodash实现深拷贝
（八）原型
如何理解原型？如何理解原型链？

GPU云服务器云服务器年终总结网络总结方法总结函数总结

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/53768.html

前端最强面经汇总

摘要：获取的对象范围方法获取的是最终应用在元素上的所有属性对象即使没有代码，也会把默认的祖宗八代都显示出来而只能获取元素属性中的样式。因此对于一个光秃秃的元素，方法返回对象中属性值如果有就是据我测试不同环境结果可能有差异而就是。花了很长时间整理的前端面试资源，喜欢请大家不要吝啬star~ 别只收藏，点个赞，点个star再走哈~ 持续更新中……，可以关注下github 项目地址 https:...

wangjuntytl 2019-08-26 10:41 评论0 收藏0
2016年总结 - 收藏集 - 掘金

摘要：然而这次的文章，就像贺师俊所说的这篇文章是从程序员这个老年度总结前端掘金年对我来说，是重要的一年。博客导读总结个人感悟掘金此文着笔之时，已经在眼前了。今天，我就来整理一篇，我个人认为的年对开发有年终总结掘金又到 2016 Top 10 Android Library - 掘金过去的 2016 年，开源社区异常活跃，很多个人与公司争相开源自己的项目，让人眼花缭乱，然而有些项目只是昙花一...

DataPipeline 2019-08-20 16:04 评论0 收藏0
个人分享--web前端学习资源分享

摘要：前言月份开始出没社区，现在差不多月了，按照工作的说法，就是差不多过了三个月的试用期，准备转正了一般来说，差不多到了转正的时候，会进行总结或者分享会议那么今天我就把看过的一些学习资源主要是博客，博文推荐分享给大家。 1.前言 6月份开始出没社区，现在差不多9月了，按照工作的说法，就是差不多过了三个月的试用期，准备转正了！一般来说，差不多到了转正的时候，会进行总结或者分享会议！那么今天我就...

sherlock221 2019-08-20 18:59 评论0 收藏0
学习前端近一年的反思与总结

摘要：引刚开始大学生活不久后，我邂逅了前端，它闯入我的生活是那么迅速猛烈，在不知不觉中也已一年。此文仅对于自己做出反思与总结，若为向往前端的小白君提供了燃料，不胜荣幸。我正式进入了前端疲劳。引：刚开始大学生活不久后，我邂逅了前端，它闯入我的生活是那么迅速、猛烈，在不知不觉中也已一年。此文仅对于自己做出反思与总结，若为向往前端的小白君提供了燃料，不胜荣幸。初试在刚刚接触到前端时，是对于...

Brenner 2019-08-01 16:45 评论0 收藏0
参加第二届前端开发者年度大会总结

摘要：代表公司去参加今年的第二届前端开发者年度大会，散会的时候，技术老大问我，今天感觉怎么样，有什么收获，当时就零零碎碎的回答了一些，不算完美趁着还记得点什么，在这里做个自我回顾总结，谨代表个人见解，有不当之处，或若涉及图片隐私或者其它问题，烦请代表公司去参加今年的第二届前端开发者年度大会，散会的时候，Team 技术老大问我，今天感觉怎么样，有什么收获，当时就零零碎碎的回答了一些，不算完...

solocoder 2019-08-19 17:55 评论0 收藏0