boy1.arr.push(2); console.log(boy1.arr,boy2.arr);// [1,2] [1] // 缺点1:方法不能复用 console.log(boy1.say == = boy2.say) // false (说明,boy1和boy2 的say方法是独立,不是共享的) // 缺点2:不能继承父类原型上的方法 Parent.prototype.walk = function 实现步骤: Step1: 创建 callback 方法 Step2: 插入 script 标签 Step3: 后台接受到请求,解析前端传过去的 callback 方法,返回该方法的调用,并且数据作为参数传入该方法 Step4: 前端执行服务端返回的方法调用。 原因就在于 f1 是 f2 的父函数,而 f2 被赋给了一个全局变量,这导致 f2 始终在内存中,而 f2 的存在依赖于 f1,因此 f1 也始终在内存中,不会在调用结束后,被垃圾回收机制(garbage
不论是什么样的前端面试,总会问到的一个问题:前端性能优化。相信如果这个问题没有答好,在面试中会很被动。于是,趁着这个天天宅的时期,好好的整理了一番。 、CSS代码可以内嵌在HTML中,比如:rem动态等5、避免使用iFrame6、使用骨架屏二、CSS优化加载优化1、避免使用css的@import2、避免使用通配符3、避免使用! 1、选择器嵌套尽量不要超过三层2、id选择器尽量不要嵌套3、使用继承体积优化1、提取公共CSS三、JS优化运行速度1、如果没有兼容问题,尽量使用原生方法2、根据兼容浏览器的最低版本,考虑是否使用polyfill3 (Webpack拆包)减少加载体积1、压缩图片2、压缩HTML、CSS、JS代码3、开启网络压缩,如:GZIP参考 前端进阶面试题详细解答减少加载次数1、制作精灵图2、将小图片转换为base64字符串3 、使用浏览器缓存4、使用前端缓存,如: LocalStorage、Cookie、SessionStorage等5、减少重定向请求,比如:nginx反向代理的重定向6、避免使用服务端字体五、React性能优化
event//template@click="fun1" //methodsfun1(event){}需要传参数的,需要把event参数带过去,使用$event//template@click="fun2( 2,$event)" //methodsfun2(val,event){}修饰符事件修饰符stop: 阻止事件冒泡prevent: 阻止默认事件,如超链接标签的重定向capture: 网页是默认按照冒泡方式去触发函数的 面试常问!! nextTick(()=>{})当多次修改data数据时,Vue会做一个data整合进行一次渲染(也就只会调用$nextTick一次)slot 插槽默认插槽//父组件<Child>
协议端口是80,HTTPS协议端口是443;4、HTTP协议连接很简单,是无状态的;HTTPS协议是具有SSL和HTTP协议构建的可进行加密传输、身份认证的网络协议,比HTTP更加安全参考 前端进阶面试题详细解答什么是文档的预解析 ) .finally(() => { console.log('finally2') return '我是finally2返回的值' }) .then(res => { console.log ('finally2后面的then函数', res) })输出结果如下:1finally2finallyfinally2后面的then函数 2.finally()一般用的很少,只要记住以下几点就可以了 可以看到XSS危害如此之大, 那么在开发网站时就要做好防御措施,具体措施如下:可以从浏览器的执行来进行预防,一种是使用纯前端的方式,不用服务器端拼接后返回(不使用服务端渲染)。 对于 DOM 型的攻击,主要是前端脚本的不可靠而造成的,对于数据获取渲染和字符串拼接的时候应该对可能出现的恶意代码情况进行判断。
参考 前端进阶面试题详细解答react-router4的核心路由变成了组件分散到各个页面,不需要配置 比如<link> <route></route>React 16中新生命周期有哪些关于 React16 <Link>做了3件事情:有onclick那就执行onclickclick的时候阻止a标签默认事件根据跳转href(即是to),用history (web前端路由两种方式之一,history & hash /> </React.Fragement> ); }}父组件重新渲染只要父组件重新渲染了,即使传入子组件的 props 未发生变化,那么子组件也会重新渲染,进而触发 render(2) Create React App 项目直接创建一个具有 typescript 的 Create React App 项目: npx create-react-app demo --typescript(2) '/getData', getInitTodoItemAction) // 发送函数类型的action时,该action的函数体会自动执行 store.dispatch(action)}(2)
前端面试之CSS ---- display: none; 与 visibility: hidden; 的区别 联系:它们都能让元素不可见 区别: display:none;会让元素完全从渲染树中消失 p:nth-child(2) 选择属于其父元素的第二个子元素的每个
元素。 :after 在元素之前添加内容,也可以用来做清除浮动。 #id1{ } /*权重为100+1=101*/ #id1 div{ } /*权重为10+1=11*/ .class1 div{ } /*权重为10+10+1=21*/ .class1 .class2 CSS可以拆分成2部分:公共CSS 和 业务CSS: 网站的配色,字体,交互提取出为公共CSS。这部分CSS命名不应涉及具体的业务 对于业务CSS,需要有统一的命名,使用公用的前缀。 一个高度自适应的div,里面有两个div,一个高度100px,希望另一个填满剩下的高度 方案1: .sub { height: calc(100%-100px); } 方案2: .container
(1)hash 模式的实现原理早期的前端路由的实现就是基于 location.hash 来实现的。其实现原理很简单,location.hash 的值就是 URL 中 # 后面的内容。 (2)history 模式的实现原理HTML5 提供了 History API 来实现 URL 的变化。 有时候,可能遇到这样的情况,DOM1的数据发生了变化,而DOM2需要从DOM1中获取数据,那这时就会发现DOM2的视图并没有更新,这时就需要用到了nextTick了。 常用的2个属性 include/exclude,2个生命周期 activated, deactivated参考 前端进阶面试题详细解答Vue路由的钩子函数首页可以控制导航跳转,beforeEach,afterEach 利用自定义事件new Event()创建这两个事件,并全局监听:<body> <button onclick="goPage<em>2</em>()">去page2</button>
2. 标签定义文档或者文档的一部分区域的页眉。元素应该作为介绍内容或者导航链接栏的容器。 六、表单控件,calendar、date、time、email、url、search 七、新的技术webworker, websocket, Geolocation 2 HTML为什么只需要写<! 区别2: link 引用 CSS 时,在页面载入时同时加载;@import 需要页面网页完全载入以后加载。
Create React App 项目直接创建一个具有 typescript 的 Create React App 项目: npx create-react-app demo --typescript(2) componentDidUpdate -- 常用于更新 DOM,响应 prop 或 state 的改变componentWillUnmount -- 在这你可以取消网络请求,或者移除所有与组件相关的事件监听器参考 前端进阶面试题详细解答何为 <Parent>
你好,我是前端岩家兴,很高兴以这种方式遇见你,废话不多说,直接发面试题吧,做完找我对答案,2333333333。 先做十题压压惊 这位选手,请问你对Javascript的垃圾回收机制有了解吗? 最后 简单聊聊面试,免不了要和面试官打交道,那么我觉得你要抓牢这几点。
指向对象本身:var a = 1;var obj = { a:2, fn:function(){ console.log(this.a) }}obj.fn() //输出2 (3)构造函数 参考 前端进阶面试题详细解答10.如何改变this指针的指向?可以使用apply、call、bind方法改变this指向(并不会改变函数的作用域)。 (1,2,3))) //--apply 输出3 console.log(Math.max.call(null, 1,2,3)) //--call 输出3 console.log(Math.max.bind ,import则是导出值的引用; (4)require时运行时动态加载,import是静态编译; (5)require调用时默认不是严格模式,import则默认调用严格模式.前端面试指南系列传送门: 前端面试指南之Vue面试题总结前端面试指南之HTML面试题总结前端面试指南之CSS面试题总结
对于浏览器的缓存,主要针对的是前端的静态资源,最好的效果就是,在发起请求之后,拉取相应的静态资源,并保存在本地。 提高了网站的性能加快了客户端网页的加载速度减少了多余网络数据传输js脚本加载问题,async、defer问题如果依赖其他脚本和 DOM 结果,使用 defer如果与 DOM 和其他脚本依赖不强时,使用 async参考 前端进阶面试题详细解答代码输出结果 // 浏览器中打印 timer1, promise1, timer2, promise2// node 中打印 timer1, timer2, promise1, promise2Node 中的 process.nextTick 快排--时间复杂度 nlogn~ n^2 之间题目描述:实现一个快排实现代码如下:function quickSort(arr) { if (arr.length < 2) { return arr function async2 () { return new Promise((resolve, reject) => { console.log('async2') reject('
该meta标签的作用是让当前viewport的宽度等于设备的宽度,同时不允许用户手动缩放。当然maximum-scale=1.0, user-scalable=0不是必需的,是否允许用户手动播放根据网站的需求来定,但把width设为width-device基本是必须的,这样能保证不会出现横向滚动条。
/* 答: 微信小程序采用JavaScript、WXML、WXSS三种技术进行开发,从技术讲和现有的前端开发差不多,但深入挖掘的话却又有所不同。 // 4、xss与csrf两种攻击原理和前端的防护方法? var arr=[1,2,3,4,5,1,2,3]; // 8、使用正则验证前端录入的邮箱地址是否正确? [a-zA-Z0-9]{2,6}$/;//邮箱验证 // 9、简述ajax的原理,并说明如何实现跨域? 2XX系列:代表请求已成功被服务器接收、理解、并接受。这系列中最常见的有200、201状态码。
this.value); }; if (this.state === 'rejected') { let x = onRejected(this.reason); }; }}5)面试够用版 参考 前端进阶面试题详细解答为什么 0.1 + 0.2 != 0.3,请详述理由因为 JS 采用 IEEE 754 双精度版本(64位),并且只要采用 IEEE 754 的语言都有该问题。 所以我们得出 0.1 = 2^-4 * 1.10011(0011),那么 0.2 的演算也基本如上所示,只需要去掉第一步乘法,所以得出 0.2 = 2^-3 * 1.10011(0011)。 所以 2^-4 * 1.10011...001 进位后就变成了 2^-4 * 1.10011(0011 * 12次)010 。 2.
这是一份自己总结的关于准备前端面试的一个复习汇总项目,项目不定时更新。 这不仅仅是一份用于求职面试的攻略,也是一份前端er用来检视自己,实现突破的宝典。 拥有两年前端面试官的经验, 对于面试的一些技术问题和套路有一定的认识和积累。 阿里巴巴 P5 面试分享:2018阿里巴巴前端面试总结(题目+答案) P6 前端面试分享: 两年经验社招-阿里巴巴 面试分享:一年经验初探阿里巴巴前端社招 阿里巴巴前端面试分享-社招(p6) 头条 P4 今日头条前端面试-2018.03.23 记一次字节跳动前端面试,已拿offer 字节跳动 前端 三面面经 2019 字节跳动春招 web前端面试题 一面 字节跳动前端实习一面二面HR面面经 头条前端一面 记一次今日头条前端面试 P5 前端面试-今日头条 字节跳动春招前端三轮面经 今日头条前端三轮面试面经 P6 字节跳动,前端面试 HR 到了这一步说明技术上没有什么问题了,接下来就是 HR 看你这个人价值观是否符合了
不论是什么样的前端面试,总会问到的一个问题:前端性能优化。相信如果这个问题没有答好,在面试中会很被动。于是,趁着这个天天宅的时期,好好的整理了一番。 、CSS代码可以内嵌在HTML中,比如:rem动态等5、避免使用iFrame6、使用骨架屏二、CSS优化加载优化1、避免使用css的@import2、避免使用通配符3、避免使用! impotant4、优化css reset,项目中不会用到这么多reset5、避免使用css表达式动画优化1、可以使用transform开启图形加速2、用translate取代left,可以避免页面重排更多面试题解答参见 前端进阶面试题详细解答选择器优化1、选择器嵌套尽量不要超过三层2、id选择器尽量不要嵌套3、使用继承体积优化1、提取公共CSS三、JS优化运行速度1、如果没有兼容问题,尽量使用原生方法2、根据兼容浏览器的最低版本 (Webpack拆包)减少加载体积1、压缩图片2、压缩HTML、CSS、JS代码3、开启网络压缩,如:GZIP减少加载次数1、制作精灵图2、将小图片转换为base64字符串3、使用浏览器缓存4、使用前端缓存
头条前端实习面试 作者:offer-hunter 链接:https://www.nowcoder.com/discuss/155934? type=2&order=3&pos=11&page=1 来源:牛客网 一面二面紧挨着,视频面试只把记住的几个题记下来了 其余的都是我的 project 相关,没有列出来的必要 这是我放在印象笔记的,所以还有当时实现的代码 // 如果 父类不需要参数初始化 Person.call(this) //如果父类需要参数初始化 // super(arguments[2] ) 翻译成 //Person.call(this,arguments[2]) this.name = "iamWoman" this.actualName 每次间隔3秒 repeatFunc('hellworld'); 这种实现如果调用两次 repeatFunc 一共会输出4次,因为 count 被公用了 而且只能接受一个参数 当时更好的写法没有想出来 面试官到最后给了一个写法
而解析 HTTP2 的请求就不用这么麻烦,因为 HTTP2 是基于帧的协议,每个帧都有表示帧长度的字段。 构造函数、原型、原型链、JS面试对象的理解 构造函数模式的目的就是为了创建一个自定义类,并且创建这个类的实例。构造函数模式中拥有了类和实例的概念,并且实例和实例之间是相互独立的,即实例识别。 面试对象:将所需要做的功能抽象成一个“对象”,然后反复调用这个对象来完成你想要的功能 14. ) 前端代理我在vue中主要是通过vue脚手架中的config中的index文件来配置的,其中有个proxyTable来配置跨域的 三、是CORS CORS全称叫跨域资源共享,主要是后台工程师设置后端代码来达到前端跨域请求的 方面: 加载优化 渲染优化 内存优化 电源优化 核心:减少前端资源数量,减小前端资源大小,减少dom操作 代码层面:注意事件的销毁、路由懒加载、提取公共代码、css放前面、组件懒加载、减少代码体积大小
(用box-sizing:content-box;),IE模型(box-size: border-box) 垂直居中方法(方法太多了,随便举几个) 1.display: flex; 2.