标签:声明 版本 ora 方式 ted 渲染 经典 font params
1. alert(1&&2)的结果是2
只要“&&”前面是false,无论“&&”后面是true还是false,结果都将返“&&”前面的值;
只要“&&”前面是true,无论“&&”后面是true还是false,结果都将返“&&”后面的值;
alert(0||1)的结果是1
只要“||”前面为false,不管“||”后面是true还是false,都返回“||”后面的值。
只要“||”前面为true,不管“||”后面是true还是false,都返回“||”前面的值。
2mouseenter与mouseover区别
不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。对应mouseout
只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。对应mouseleave
3. 用正则表达式匹配字符串,以字母开头,后面是数字、字符串或者下划线,长度为 9-20
var re=new RegExp=("^[a-zA-Z][a-zA-Z0-9_]{9-20}$")
4.js 字符串两边截取空白的 trim 的原型方法的实现
2 String.prototype.trim = function () { 3 var arr=this.split(""); 4 while(1) { 5 if(arr[0]==" ") { 6 arr.shift(); 7 continue; 8 } 9 break; 10 } 11 while(1){ 12 if(arr[arr.length-1]==" ") { 13 arr.pop(); 14 continue; 15 } 16 break; 17 } 18 return arr.join(""); 19 } 20 //后来面试官跟我说一句话就解决了,然而我正则都忘了,平时没怎么用 21 String.prototype.trim = function () { 22 return this.replace(/(^\s*)|(\s*$)/g,‘‘); 23 };
5.三道判断输出的题都是经典的题
1 //5.1 2 var a=4; 3 function b() { 4 a=3; 5 console.log(a); 6 function a(){}; 7 } 8 b(); 9 //明显输出是3,因为里面修改了a这个全局变量,那个function a(){}是用来干扰的,虽然函数声明会提升,就被a给覆盖掉了,这是我的理解 10 //5.2 12 //不记得具体的就类似如下 13 var baz=3; 14 var bazz={ 15 baz: 2, 16 getbaz: function() { 17 return this.baz 18 } 19 } 20 console.log(bazz.getbaz()) 21 var g=bazz.getbaz; 22 console.log(g()) ; 23 //第一个输出是2,第二个输出是3,这题考察的就是this的指向,函数作为对象本身属性调用的时候this指向对象,作为普通函数调用的时候就指向全局了 24 //5.3var arr=[1,2,3,4,5]; 25 for(var i=0;i<arr.length;i++) 26 { 27 arr[i]=function(){ 28 alert(i) 29 } 30 } 31 arr[3](); 32 //典型的闭包啊,看都不用看,肯定弹出5啊
6 position 不同值及区别
absolute生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。(不占位)
relective生成相对定位的元素,相对于其正常位置进行定位。因此,”left:20” 会向元素的 LEFT 位置添加 20 像素。(占位)
static 默认值。没有定位,元素出现在正常的流中(忽略 top, bottom, left, right 或者 z-index 声明)inherit:规定应该从父元素继承 position 属性的值。
fixed 生成绝对定位的元素,相对于浏览器窗口进行定位。元素的位置通过 “left”, “top”, “right” 以及 “bottom” 属性进行规定。
8. 讲述你对 reflow 和 repaint 的理解
repaint 就是重绘,reflow 就是回流。repaint 主要是针对某一个 DOM 元素进行的重绘,reflow 则是回流,针对整个页面的重排。
严重性:在性能优先的前提下,性能消耗 reflow 大于 repaint。
体现:repaint 是某个 DOM 元素进行重绘;reflow 是整个页面进行重排,也就是页面所有 DOM 元素渲染。
如何触发:style 变动造成 repaint 和 reflow。不涉及任何 DOM 元素的排版问题的变动为 repaint,例如元素的 color/text-align/text-decoration 等等属性的变动。除上面所提到的 DOM 元素 style 的修改基本为 reflow。例如元素的任何涉及长、宽、行高、边框、display 等 style 的修改
触发 repaint:
1 color的修改,如color=#ddd;
2 text-align的修改,如text-align=center;
3 a:hover也会造成重绘。
4 :hover引起的颜色等不导致页面回流的style变动。
触发 reflow:
1 width/height/border/margin/padding的修改,如width=778px;
2 动画,:hover等伪类引起的元素表现改动,display=none等造成页面回流;
3 appendChild等DOM元素操作;
4 font类style的修改;
5 background的修改,注意着字面上可能以为是重绘,但是浏览器确实回流了,经过浏览器厂家的优化,部分background的修改只触发repaint,当然IE不用考虑;
6 scroll页面,这个不可避免;
7 resize页面,桌面版本的进行浏览器大小的缩放,移动端的话,还没玩过能拖动程序,resize程序窗口大小的多窗口操作系统。
8 读取元素的属性(这个无法理解,但是技术达人是这么说的,那就把它当做定理吧):读取元素的某些属性(offsetLeft、offsetTop、offsetHeight、offsetWidth、scrollTop/Left/Width/Height、clientTop/Left/Width/Height、getComputedStyle()、currentStyle(in IE));
如何避免:
尽可能在 DOM 末梢通过改变 class 来修改元素的 style 属性:尽可能的减少受影响的 DOM 元素。
避免设置多项内联样式:使用常用的 class 的方式进行设置样式,以避免设置样式时访问 DOM 的低效率。
设置动画元素 position 属性为 fixed 或者 absolute:由于当前元素从 DOM 流中独立出来,因此受影响的只有当前元素,元素 repaint。
牺牲平滑度满足性能:动画精度太强,会造成更多次的 repaint/reflow,牺牲精度,能满足性能的损耗,获取性能和平滑度的平衡。
避免使用 table 进行布局:table 的每个元素的大小以及内容的改动,都会导致整个 table 进行重新计算,造成大幅度的 repaint 或者 reflow。改用 div 则可以进行针对性的 repaint 和避免不必要的 reflow。
标签:声明 版本 ora 方式 ted 渲染 经典 font params
原文地址:https://www.cnblogs.com/asasas/p/9540287.html