声明：建议只看题，答案全不准确1.JavaScript1.htmlhttps://zhuanlan.zhihu.com/p/中的javascript文件在什么情况下，放在什么位置...对于必须在DOM加载前运行的javascript脚本，我们需要将这些脚本放在页面头部而不是使用外部引用，因为外部引用增加了网络请求的数量；2.async和deferasync的区别是指异步加载JavaScript文件。它的下载过程可以在HTML解析过程中运行。加载完成后，会立即执行该文件的代码。文件代码执行过程中，HTML解析会被阻塞，不保证文件的加载顺序。defer表示JavaScript文件在HTML文档被解析后加载。JavaScript文件的下载过程可以在HTML解析过程中进行。它根据脚本标签的顺序加载文件。3、map、forEach、reduce的区别。地图返回一个新数组。forEach遍历数组，返回值是一个未定义的reduce累加器。遍历时，避免创建新数组以减少冗余（rong）。返回值由参数回调决定。4.cookie、session、localStroage区别session会在服务器上保存一定时间。当访问量增加时，服务器的资源就会被占用，所以考虑到服务器的性能，可以使用cookies。cookie的存储容量是有限的。单个cookie保存的数据不能超过4k，很多浏览器限制一个站点最多保存20个cookie。对于seesion来说，它的默认大小一般是1024klocalStorage本地存储和cookie存储在浏览器端，都是同源的。每个域是5MB5。call、apply和bind的区别是apply接受2个参数：一个是它运行的函数作用域（Scope），另一个可以是arguments或者Array的实例。经典案例：#获取数组中最大的值#;#使用push合并数组#;call和apply的使用方法相同，只是除了第一个是，其他参数必须一一列出范围。经典用例：#Usingcall调用匿名函数#bind接受1个参数并返回一个新函数，其this值来自contextFunction.prototype.bind=function(context){varself=this由bind(context)函数传递;//原函数returnfunction(){//返回一个新函数returnself.apply(context,arguments)}}6.事件绑定有哪些类型，在什么情况下使用？7.请解释一下事件委托或事件代理8.什么是异步编程9.异步编程中如何捕获异常10.你会怎么写https://segmentfault.com/a/11...思路一：1.双层循环，外层循环元素，内存循环时比较值2.如果有相同的值则跳过（break），如果不相同则push到数组附近思路2：直接使用splice来对原数组进行操作（删除元素时，需要更新数组长度）思路三：利用对象属性不能相同的特性进行去重思路四：数组递归去重1.使用递归思路2.先排序，再从头比较。如果它们相同，则删除它们。思路五：使用indexOf和forEach思路六：使用indexOf和排序思路七：使用ES6set11。当被问及闭包时，你应该回答哪些方面？1.变量的作用域在函数中查找变量时，如果函数变量中没有这个东西，那么查找过程就会按照代码执行环境创建的作用域链逐层查找。2.变量的生命周期全局变量的生命周期是永久的。对于函数中用var声明的局部变量，当退出函数时，这些局部变量会随着函数调用结束而销毁。3、闭包结构局部变量所在的执行环境仍然可以被外界访问，所以这个局部变量有理由不被销毁。4.闭包和内存管理使用闭包封装的动机：主动将一些变量封装在闭包中，以便以后使用。将变量放在闭包中和放在全局作用域中对内存的影响是一样的，这里不能说是内存泄漏。如果以后需要回收这些变量，我们可以手动将这些变量设置为null2。CSS1。块级元素和行内元素的区别，inline-block2的用法。如何在块级元素和行内元素之间水平和垂直居中3.css什么是module4.css选择器的优先级5.csshack是什么，你用过哪些6.css中的单位有哪些，它们的区别和优缺点7.cssdiv的高度填充剩余空间父容器8.flex弹性布局3.react1.react的缺点1.wrapperhellwrapper函数嵌套太深，不建议使用mixins模式2.huge组件太大，学习成本太高，中心化程度高无法抽取细化函数3.混淆类有时不知道是用类创建函数还是用函数创建函数。有时在生命周期注册完事件后，需要在销毁阶段手动取消事件。注册监听事件后，需要在组件发生变化时手动释放事件。其他：不自动转换Booleanletstring='';Boolean(string)//falsefunctionreturn({string&&beforebooltypeconversion}//会报错)1.redux和mobx的区别具体参考：https://www.robinwieruch.de/r...Redux受函数式编程的影响，它总是返回一个新的状态，而不是改变状态。//在Redux中不要这样做，因为它会改变数组state,action){return[...state.authors,action.author]}状态数据遵循标准化的数据格式，可以保持状态数据扁平化（flatstate）和单一（identity）信息源（singlesourceoftruth）.{post:{id:'a',authorId:'b',...},author:{id:'b',postIds:['a',...],...}}Mobx有对象面向编程和反应式编程。它将您的状态包装在Observable状态中。因此，您获得了状态中的所有可观察功能。Mobx中的状态是可变的。因此，可以直接改变状态：functionaddAuthor(author){this.authors.push(author)}数据结构状态可以在Redux中保持深度嵌套，状态是只读的，状态只能改变通过显示动作。相反，在Mobx中，state是允许读写的，可以直接改变state，不需要actions2。redux的缺点https://stackoverflow.com/que...例如：//state中的list指的是listthis.state={redux中的list:this.props.list||[]}//修改listvalueinthecomponentthis.setState({list:[1,2,3]})//此时redux中的list也发生了变化，但是没有变化传递给actionconsole.log(this.props.list)//[1,2,3]redux的核心概念之一就是#state是不可变的#;使用Object.assign()合并对象无法实现深拷贝3。mobx的缺点https://stackoverflow.com/que...无法得知数据何时发生变化（或更新），难以追踪（参考redux-logger和mobx-logger）4.WhyissetStateasynchronous为什么setState是异步的？回答这个问题首先要细化：调用setState会发生什么？当setState被调用时，React会在“和解”()的过程中将setState()的对象合并到组件的当前状态中，并创建一个新的React元素树（我理解为虚拟DOM树）。将新的DOM树与setState之前的虚拟DOM树进行比较（diff），根据结果准确响应UI。因此，我个人的理解是比较过程需要一定的时间。为了防止阻塞，setState设置为异步。.com/livoras/bl...算法实现第一步：用JS对象模拟DOM树第二步：比较两棵虚拟DOM树的差异这两棵树的完整diff算法是一个时间复杂度O(n^3)问题，但是在前端，跨层移动DOM元素的情况很少见。因此，VirtualDOM只会比较同一层次的元素：1.深度优先遍历，记录差异2.可能的差异类型2.1替换原来的节点2.2移动、删除、添加子节点2.3修改节点的属性2.4文本节点是更改了varREPLACE=0varREORDER=1varPROPS=2varTEXT=33.列表比较算法关键算法：#string最小编辑距离#(EditionDistance);#编辑距离#;O(M*N)步骤三：将差异应用于真正的DOM树6.如何在React中使用内联样式？7.如何在react中使用jQuery？？？8.xx版本之后更新了什么https://reactjs.org/versions/收到这个问题之前，我从来不关心每次出新版本更新了什么。这个问题让我成长了很多。9.React做了哪些性能优化？10、ReactNative移动端适配函数scaleSize(size){letscreenW=Dimensions.get('window').width>Dimensions.get('window').height?Dimensions.get('window').height:Dimensions.get('窗口').width;常量默认宽度=375；//UI图上的基本宽度const_scaleWidth=screenW/defaultWidth;返回大小*_scaleWidth;}4。vue1.vue双向绑定原理https://www.jianshu.com/p/e42...基本原理：1.使用Object.defineProperty监听对象赋值动作2.遍历所有节点3.使用观察者模式拥有v-model属性的DOM节点订阅上面的时间4.发布事件到带有v-bind属性的DOM节点5.使用`addEventListener('input',function(e){/.../})来监听表单标签上的事件对象。defineProperty(vModelList,key,{enumerable:true,configurable:true,set:function(newVal){//publish_observer.trigger(key,newVal)}});2、正则贪心匹配实现数据绑定（模板字符串）https://segmentfault.com/a/11...String.prototype.render=function(context){returnthis.replace(/\{\{([^\}]+)\}\}/g,(match,key)=>(context[key]||match));}》你好，{{name}}，我们会通知你面试结果在{{day}}天内。".render({name:"Niko",day:3})5.http1.jsonp是什么https://www.zhihu.com/questio...很简单，没有跨域限制，使用元素，地址指向第三方的APIURL，形式为：并提供回调函数接收数据（函数名可约定，也可传通过address参数）。第三方生成的response是json数据的包装（所以叫jsonp，即jsonpadding），形式为：callback({"name":"hax","gender":"Male"})这样浏览器会调用回调函数，将解析后的json对象作为参数传入，本站脚本可以在回调函数中处理传入的数据。补充：“历史遗迹”是指如果今天重新设计，可能不允许这么简单的跨域。哎，比如说可能像XHR一样，要求服务器根据CORS规范发送特定的http头。输入URL到页面加载https://segmentfault.com/a/11发生了什么...1.DNS解析2.TCP连接3.HTTP发生请求4.服务器处理请求并返回HTTP报文5.浏览器解析渲染页面6.连接端的padding和margin禁止使用flexflex弹性布局请使用flex完成
