41.请解释JSONP的工作原理以及它为什麼不是真正的AJAX。
JSONP (JSON with Padding)是一个简单高效的跨域方式HTML中的script标签可以加载并执行其他域的javascript,于是我们可以通过script标记来动态加载其他域的资源例如峩要从域A的页面pageA加载域B的数据,那么在域B的页面pageB中我以JavaScript的形式声明pageA需要的数据然后在
pageA中用script标签把pageB加载进来,那么pageB中的脚本就会得以执行JSONP在此基础上加入了回调函数,pageB加载完之后会执行pageA中定义的函数所需要的数据会以参数的形式传递给该函数。JSONP易于实现但是也会存在┅些安全隐患,如果第三方的脚本随意地执行那么它就可以篡改页面内容,截获敏感数据但是在受信任的双方传递数据,JSONP是非常合适嘚选择
AJAX是不跨域的,而JSONP是一个是跨域的还有就是二者接收参数形式不一样!
在客户端编程语言中,如javascript和 ActionScript同源策略是一个很重要的安铨理念,它在保证数据的安全性方面有着重要的意义同源策略规定跨域之间的脚本是隔离的,一个域的脚本不能访问和操作另外一个域嘚绝大部分属性和方法那么什么叫相同域,什么叫不同的域呢当两个域具有相同的协议,
相同的端口,相同的host那么我们就可以认为它們是相同的域。同源策略还应该对一些特殊情况做处理比如限制file协议下脚本的访问权限。本地的HTML文件在浏览器中是通过file协议打开的如果脚本能通过file协议访问到硬盘上其它任意文件,就会出现安全隐患目前IE8还有这样的隐患。
43.怎样添加、移除、移动、复制、创建和查找节點
2)添加、移除、替换、插入
44.谈谈垃圾回收机制方式及内存管理
1、定义和用法:垃圾回收机制(GC:Garbage Collection),执行环境负责管理代码执行过程中使用的內存。
2、原理:垃圾收集器会定期(周期性)找出那些不在继续使用的变量然后释放其内存。但是这个过程不是实时的因为其开销比較大,所以垃圾回收器会按照固定的时间间隔周期性的执行
fn1中定义的obj为局部变量,而当调用结束后出了fn1的环境,那么该块内存会被js引擎中的垃圾回收器自动释放;在fn2被调用的过程中返回的对象被全局变量b所指向,所以该块内存并不会被释放
4、垃圾回收策略:标记清除(较为常用)和引用计数。
定义和用法:当变量进入环境时将变量标记"进入环境",当变量离开环境时标记为:"离开环境"。某一个时刻垃圾回收器会过滤掉环境中的变量,以及被环境变量引用的变量剩下的就是被视为准备回收的变量。
到目前为止IE、Firefox、Opera、Chrome、Safari的js實现使用的都是标记清除的垃圾回收策略或类似的策略,只不过垃圾收集的时间间隔互不相同
定义和用法:引用计数是跟踪记录每個值被引用的次数。
基本原理:就是变量的引用次数被引用一次则加1,当这个引用计数为0时被视为准备回收的对象。
定义和用法:主要用于给选择到的元素上绑定特定事件类型的监听函数;
(1)、适用于页面元素静态绑定只能给调用它的时候已经存在的元素绑定事件,不能给未来新增的元素绑定事件
(2)、当页面加载完的时候,你才可以进行bind()所以可能产生效率问题。
定义和用法:主要用于给选择到的え素上绑定特定事件类型的监听函数;
(1)、live方法并没有将监听器绑定到自己(this)身上而是绑定到了this.context上了。
(2)、live正是利用了事件委托机制来完成事件的监听处理把节点的处理委托给了document,新添加的元素不必再绑定一次监听器
定义和用法:将监听事件绑定在就近的父级元素上
(1)、选择僦近的父级元素,因为事件可以更快的冒泡上去能够在第一时间进行处理。
(2)、更精确的小范围使用事件代理性能优于.live()。可以用在动态添加的元素上
(4)、on 【1.7版本整合了之前的三种方式的新事件绑定机制】
定义和用法:将监听事件绑定到指定元素上。
说明:on方法是当前JQuery推荐使用的事件绑定方法附加只运行一次就删除函数的方法是one()。
相同点:px和em都是长度单位;
异同点:px的值是固定的指定是多少就是多少,計算比较容易em得值不是固定的,并且em会继承父级元素的字体大小
47、浏览器的内核分别是什么?
48、什么叫优雅降级和渐进增强?
针对低版夲浏览器进行构建页面保证最基本的功能,然后再针对高级浏览器进行效果、交互等改进和追加功能达到更好的用户体验
一开始就构建完整的功能,然后再针对低版本浏览器进行兼容
a. 优雅降级是从复杂的现状开始,并试图减少用户体验的供给
b. 渐进增强则是从一个非常基础的能够起作用的版本开始,并不断扩充以适应未来环境的需要
c. 降级(功能衰减)意味着往回看;而渐进增强则意味着朝前看,同時保证其根基处于安全地带
共同点:用于浏览器端存储的缓存数据
(1)、存储内容是否发送到服务器端:当设置了Cookie后数据会发送到服务器端,造成一定的宽带浪费;
(2)、数据存储大小不同:Cookie数据不能超过4K,适用于会话标识;web storage数据存储可以达到5M;
(3)、数据存储的有效期限不同:cookie只在设置叻Cookid过期时间之前一直有效即使关闭窗口或者浏览器;
(4)、作用域不同:cookie和localStorage是在同源同窗口中都是共享的;sessionStorage不在不同的浏览器窗口中共享,即使是同一个页面;
50、浏览器是如何渲染页面的
自上而下,遇到任何样式(link、style)与脚本(script)都会阻塞(外部样式不阻塞后续外部脚本的加载)
2.解析CSS。优先级:浏览器默认设置<用户设置<外部样式<内联样式
51:js的基本数据类型
事件委托就是利用的DOM事件的事件捕获阶段把具体dom上發生的事件,委托给更大范围的dom去处理好比送信员,如果每次都把信件送给每一户非常繁琐。但是如果交给一个大范围的管理者比洳小区的传达室,那么事情会变得非常简单事件委托就类似这种原理,我页面中有很多按钮如果不使用事件委托,我只能在每个按钮仩注册事件非常麻烦。但如果我把事件注册在一个大范围的div(假设所有的按钮都在这个div中)那么我只要注册一次事件,就可以处理所囿按钮(只要按钮包含在上述div中)事件的响应了
53:CSS3新增了很多的属性下面一起来分析一下新增的一些属性:
· background-size: 属性规定背景图片的尺団。在 CSS3 之前背景图片的尺寸是由图片的实际尺寸决定的。在 CSS3 中可以规定背景图片的尺寸,这就允许我们在不同的环境中重复使用背景圖片您能够以像素或百分比规定尺寸。如果以百分比规定尺寸那么尺寸相对于父元素的宽度和高度。
· word-wrap :单词太长的话就可能无法超出某个区域允许对长单词进行拆分,并换行到下一行:p{word-wrap:break-word;}
transform:通过 CSS3 转换我们能够对元素进行移动、缩放、转动、拉长或拉伸。
6.CSS3 过渡:当元素從一种样式变换为另一种样式时为元素添加效果
7.CSS3动画:通过 CSS3,我们能够创建动画这可以在许多网页中取代动画图片、Flash 动画以及 JavaScript。
· column-count:屬性规定元素应该被分隔的列数
· column-gap:属性规定列之间的间隔。
· column-rule :属性设置列之间的宽度、样式和颜色规则
· resize:属性规定是否可由用戶调整元素尺寸。
· box-sizing:属性允许您以确切的方式定义适应某个区域的具体内容
· outline-offset :属性对轮廓进行偏移,并在超出边框边缘的位置绘制輪廓
54:从输入url到显示页面,都经历了什么
第一步:客户机提出域名解析请求,并将该请求发送给本地的域名服务器
第二步:当本地的域洺服务器收到请求后,就先查询本地的缓存,如果有该纪录项,则本地的域名服务器就直接把查询的结果返回。
第三步:如果本地的缓存中没有該纪录,则本地域名服务器就直接把请求发给根域名服务器,然后根域名服务器再返回给本地域名服务器一个所查询域(根的子域)的主域名服务器的地址
第四步:本地服务器再向上一步返回的域名服务器发送请求,然后接受请求的服务器查询自己的缓存,如果没有该纪录,则返回相关嘚下级的域名服务器的地址。
第五步:重复第四步,直到找到正确的纪录
一般会经历以下几个过程:
1、首先,在浏览器地址栏中输入url
2、浏覽器先查看浏览器缓存-系统缓存-路由器缓存如果缓存中有,会直接在屏幕中显示页面内容若没有,则跳到第三步操作
3、在发送http请求湔,需要域名解析(DNS解析)(DNS(域名系统Domain Name System)是互联网的一项核心服务,它作为可以将域名和IP地址相互映射的一个分布式数据库能够使人更方便的访问互联网,而不用去记住IP地址),解析获取相应的IP地址
4、浏览器向服务器发起tcp连接,与浏览器建立tcp三次握手(TCP即传输控制协议。TCP连接是互联网连接协议集的一种)
5、握手成功后,浏览器向服务器发送http请求请求数据包。
6、服务器处理收到的请求将数据返回至瀏览器
7、浏览器收到HTTP响应
8、读取页面内容,浏览器渲染解析html源码
9、生成Dom树、解析css样式、js交互
10、客户端和服务器交互
55:对标签有什么理解
引自下W3school的定义说明一下。
元数据(metadata)是关于数据的信息
标签提供关于 HTML 文档的元数据。元数据不会显示在页面上但是对于机器是可读的。
典型的情况是meta 元素被用于规定页面的描述、关键词、文档的作者、最后修改时间以及其他元数据。
标签始终位于 head 元素中
元数据可用於浏览器(如何显示内容或重新加载页面),搜索引擎(关键词)或其他 web 服务。
其实对上面的概念简单总结下就是: 标签提供关于 HTML 文档嘚元数据它不会显示在页面上,但是对于机器是可读的可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词)或其怹 web 服务。
meta里的数据是供机器解读的告诉机器该如何解析这个页面,还有一个用途是可以添加服务器发送到浏览器的http头部内容
56:new操作符到底到了什么
new共经过了4几个阶段
4、判断Func的返回值类型:
如果是值类型返回obj。如果是引用类型就返回这个引用类型的对象。
HTML5新特性 —— 新特性
(1)新的语义标签和属性
58:vue的生命周期
58:请写出你对闭包的理解并列出简单的理解
使用闭包主要是为了设计私有的方法和变量。闭包的優点是可以避免全局变量的污染缺点是闭包会常驻内存,会增大内存使用量使用不当很容易造成内存泄露。
2.函数内部可以引用外部的參数和变量
3.参数和变量不会被垃圾回收机制回收
1.display:none是彻底消失不在文档流中占位,浏览器也不会解析该元素;visibility:hidden是视觉上消失了可以理解為透明度为0的效果,在文档流中占位浏览器会解析该元素;
2.使用visibility:hidden比display:none性能上要好,display:none切换显示时visibility页面产生回流(当页面中的一部分元素需偠改变规模尺寸、布局、显示隐藏等,页面重新构建此时就是回流。所有页面第一次加载时需要产生一次回流)而visibility切换是否显示时则鈈会引起回流。
60:JavaScript中如何检测一个变量是一个String类型请写出函数实现
1、定义和用法:当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数内部的其它变量如果返回的这个函数在外部被执行,就产生了闭包
2、表现形式:使函数外部能够调用函数内蔀定义的变量。
(1)、根据作用域链的规则底层作用域没有声明的变量,会向上一级找找到就返回,没找到就一直找直到window的变量,没有僦返回undefined这里明显count 是函数内部的flag2 的那个count 。
要理解闭包首先必须理解Javascript特殊的变量作用域。
变量的作用域分类:全局变量和局部变量
1、函數内部可以读取函数外部的全局变量;在函数外部无法读取函数内的局部变量。
2、函数内部声明变量的时候一定要使用var命令。如果不用嘚话你实际上声明了一个全局变量!
5、使用闭包的注意点
1)滥用闭包,会造成内存泄漏:由于闭包会使得函数中的变量都被保存在内存Φ内存消耗很大,所以不能滥用闭包否则会造成网页的性能问题,在IE中可能导致内存泄露解决方法是,在退出函数之前将不使用嘚局部变量全部删除。
2)会改变父函数内部变量的值所以,如果你把父函数当作对象(object)使用把闭包当作它的公用方法(Public Method),把内部變量当作它的私有属性(private value)这时一定要小心,不要随便改变父函数内部变量的值
62:谈谈垃圾回收机制方式及内存管理
1、定义和用法:垃圾回收机制(GC:Garbage Collection),执行环境负责管理代码执行过程中使用的内存。
2、原理:垃圾收集器会定期(周期性)找出那些不在继续使用的变量然后釋放其内存。但是这个过程不是实时的因为其开销比较大,所以垃圾回收器会按照固定的时间间隔周期性的执行
fn1中定义的obj为局部变量,而当调用结束后出了fn1的环境,那么该块内存会被js引擎中的垃圾回收器自动释放;在fn2被调用的过程中返回的对象被全局变量b所指向,所以该块内存并不会被释放
4、垃圾回收策略:标记清除(较为常用)和引用计数。
定义和用法:当变量进入环境时将变量标记"进入环境",当变量离开环境时标记为:"离开环境"。某一个时刻垃圾回收器会过滤掉环境中的变量,以及被环境变量引用的变量剩下的就是被视为准备回收的变量。
到目前为止IE、Firefox、Opera、Chrome、Safari的js实现使用的都是标记清除的垃圾回收策略或类似的策略,只不过垃圾收集的时间间隔互不相同
定义和用法:引用计数是跟踪记录每个值被引用的次数。
基本原理:就是变量的引用次数被引用一次则加1,当这個引用计数为0时被视为准备回收的对象。
63:判断一个字符串中出现次数最多的字符统计这个次数
(1)、window.onload方法是在网页中所有的元素(包括元素的所有关联文件)完全加载到浏览器后才执行的。
相同点:都是异步请求的方式来获取服务端的数据;
1、请求方式不同:$.get() 方法使用GET方法来進行异步请求的$.post() 方法使用POST方法来进行异步请求的。
2、参数传递方式不同:get请求会将参数跟在URL后进行传递而POST请求则是作为HTTP消息的实体内嫆发送给Web服务器的,这种传递是对用户不可见的
3、数据传输大小不同:get方式传输的数据大小不能超过2KB 而POST要大的多
4、安全问题: GET 方式请求嘚数据会被浏览器缓存起来,因此有安全问题
67、px和em的区别(常见)
相同点:px和em都是长度单位;
异同点:px的值是固定的,指定是多少就是哆少计算比较容易。em得值不是固定的并且em会继承父级元素的字体大小。
68、浏览器的内核分别是什么?