[] == [] 输出的结果是?为什么?
false;声明引用类型的时候,变量名保存在栈内存中,值得地址保存在堆内存中(也称指针),[] == [] 实际在堆内存中保存的值不一致,所以为false 。
请说出三种减少网页加载时间的方法。
- 合理组织CSS、JavaScript代码位置
- 减少DOM操作、添加事件委托
- 部分操作可设置防抖和节流
- 对于可预见的操作采取preload或prerender的预加载
- 对于图片可以懒加载
- 合并CSS图片(精灵图/雪碧图)
- 减少使用iframe
请问什么情况下会遇到跨域问题?
当不同源的情况下就需要跨域,同源策略:协议,端口号,域名,三者有一个不一致即为不同源
jsonp、CORS可以用来解决跨域问题。
jsonp实现原理利用script标签的src属性
http协议中与资源缓存相关的协议头有哪些?
通过响应来控制缓存,在响应头中主要有cache-control、pragma、expires三个响应头
其中expires是HTTP1.0中的响应头,后面直接跟一个缓存失效日期,但是服务器和客户端之间的时钟往往不同,因此通过该响应头来控制缓存失效时间不准确,一般不用,如果要设置客户端不缓存,则设置响应头“expires: -1”即可;pragema是HTTP1.1协议为了兼容HTTP1.0+协议,用来控制不缓存,“pragma: no-cache”;cache-control是HTTP1.1中的响应头,其参数为相对的秒值,即过多少秒缓存失效,因此建议使用该响应头来控制缓存失效时间,其后可以跟的内容有no-cache、no-store、max-age、must-revalidate
CSS中box-sizing有哪些值?区别是什么?
box-sizing是CSS3新增属性,可调整盒子模型的样式。
box-sizing:border-box表示盒模型基于IE的盒模型,width和height决定盒模型的content区、padding区和border区。
box-sizing:content-box表示盒模型基于标准盒模型,width和height只决定盒模型的content区
box-sizing:inherit表示继承自父元素。
DOM Tree与Render Tree之间的区别是什么?
DOM树是包含了所有html节点的树,渲染树是DOM树和CSSOM树组合而成的,最终渲染在页面上的树。DOM树和渲染树都是浏览器生成的
在Javascript中什么情况下会进行装箱/拆箱转换?
装箱:把基本数据类型转换成对应的引用类型的操作。
拆箱:把引用类型转换成基本数据类型的操作。
在Javascript中出现 基本数据类型数据 和 引用数据类型数据要进行转换的情况下会进行装箱/拆箱操作。
写出下列代码的执行结果:
new Promise((resolve) => { console.log('1') resolve() console.log('2') }) .then(() => { console.log('3') }) setTimeout(() => { console.log('4') }) console.log('5')
12534
计算一个整数的二进制表示中连续出现1最多的次数。
比如13的二进制是:1101,那么他的二进制表示中连续出现的1最多为2次,所以答案就是2:

列举几个html5语义化标签并说说语义化有什么优点?
语义化标签:
语义化标签:
:页面主体内容。<br /><hn>:h1~h6,分级标题,<h1> 与 <title> 协调有利于搜索引擎优化。<br /><ul>:无序列表。<br /><li>:有序列表。<br /><header>:页眉通常包括网站标志、主导航、全站链接以及搜索框。<br /><nav>:标记导航,仅对文档中重要的链接群使用。<br /><main>:页面主要内容,一个页面只能使用一次。如果是web应用,则包围其主要功能。<br /><article>:定义外部的内容,其中的内容独立于文档的其余部分。<br /><section>:定义文档中的节(section、区段)。比如章节、页眉、页脚或文档中的其他部分。<br /><aside>:定义其所处内容之外的内容。如侧栏、文章的一组链接、广告、友情链接、相关产品列表等。<br /><footer>:页脚,只有当父级是body时,才是整个页面的页脚。<br /><small>:呈现小号字体效果,指定细则,输入免责声明、注解、署名、版权。<br /><strong>:和 em 标签一样,用于强调文本,但它强调的程度更强一些。<br /><em>:将其中的文本表示为强调的内容,表现为斜体。<br /><mark>:使用黄色突出显示部分文本。<br /><figure>:规定独立的流内容(图像、图表、照片、代码等等)(默认有40px左右margin)。<br /><figcaption>:定义 figure 元素的标题,应该被置于 figure 元素的第一个或最后一个子元素的位置。<br /><cite>:表示所包含的文本对某个参考文献的引用,比如书籍或者杂志的标题。<br /><blockquoto>:定义块引用,块引用拥有它们自己的空间。<br /><q>:短的引述(跨浏览器问题,尽量避免使用)。<br /><time>:datetime属性遵循特定格式,如果忽略此属性,文本内容必须是合法的日期或者时间格式。<br /><abbr>:简称或缩写。<br /><dfn>:定义术语元素,与定义必须紧挨着,可以在描述列表dl元素中使用。<br /><address>:作者、相关人士或组织的联系信息(电子邮件地址、指向联系信息页的链接)。<br /><del>:移除的内容。<br /><ins>:添加的内容。<br /><code>:标记代码。<br /><meter>:定义已知范围或分数值内的标量测量。(Internet Explorer 不支持 meter 标签)<br /><progress>:定义运行中的进度(进程)。</p>
<p><strong>优点:</strong></p>
<ol>
<li>代码结构清晰,方便阅读,有利于团队合作开发。</li><li>方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备)以语义的方式来渲染网页。</li><li>有利于搜索引擎优化(SEO)。</li></ol>
<p>请列举几种除了px外的CSS度量单位并解释其含义。</p>
<ol>
<li>rem 相对于根字体大小的单位,比如可以设置 1rem=50px<br />2. em 相对于font-size,比如font-size:16px(浏览器默认),则2em=32px<br />3. vm 即viewpoint width,视窗宽度,比如1vm的宽度为相对于视窗的宽度的百分之一<br />4. vh 即viewpoint height ,同上</li></ol>
<p>new操作符做了什么?<br />var func = function(){}<br />var newO = new func()</p>
<ol>
<li>new 会生成一个空对象newO </li><li>设置原型链 newO. <em>proto</em> = func.prototype</li><li>然后构造函数里的this会指向这个空对象</li></ol>
<p>var result = func.call(newO)</p>
<ol>
<li><p>判断Func的返回值类型:</p>
<p> 如果是值类型,返回obj。如果是引用类型,就返回这个引用类型的对象</p>
</li></ol>
<p>简述cookie/session记住登录状态机制原理。</p>
<p>用户登录成功后,用户的信息则会被服务器保存在响应头set-cookie属性中返回给服务器,之后的http请求都会携带这个cookie,而session,服务器则会存在本地,在随机生成用户登录状态的标识通过cookie返回给服务器,每次的http请求都会携带这个cookie,实现记住登录状态</p>
<p>网页中接收事件的顺序(事件流)有哪些?它们之间的区别是什么?<br />有冒泡和捕获两种</p>
<ul>
<li>冒泡是从目标元素向上传递到window,过程中遇到注册的冒泡事件就会触发</li><li>捕获是从window逐层向下传递到目标元素,过程中遇到注册的捕获事件就会触发它</li></ul>
<p>css中pisition中的属性有哪些?</p>
<ul>
<li>static:默认属性,没有定位</li><li>absolute:绝对定位</li><li>relative:相对定位</li><li>fixed:固定定位</li><li>inherit:从父级继承position属性</li></ul>
<p>简述你对HTTP控制访问(CORS)的理解。<br />跨域资源共享(CORS)是一种机制,它使用额外的HTTP头来告诉浏览器,让其运行在origin上的web被允许访问来及不同源服务器的资源。当一个资源从与该资源本身所在的不同域名,协议,端口号请求一个资源时,资源会发送一个跨域HTTP请求<br />而CORS允许浏览器向跨源服务器,发送跨域请求,克服AJAX只用同源使用的限制</p>