61.冒泡排序？
冒泡排序是js中比较好理解的一种排序算法
基本原理：比较相邻的两个数。如果第一个比第二个大，就交换他们两个
for(var j=0;j<list.length-1;j++){
? ? ? ? for(var i = 0;i < list.length-1-j; i++){ // 0 length-2
? ? ? ? ? ? if(list[i] > list[i+1]){
? ? ? ? ? ? ? ? var ?temp = list[i];
? ? ? ? ? ? ? ? list[i] = list[i+1];
? ? ? ? ? ? ? ? list[i+1] = temp;
? ? ? ? ? ? }
? ? ? ? }
? ? ? ? console.log(j,list);
? ? }
?
62.创建新数组，向数组插入数据？
- push以及unshift即可向数组插入元素
- 如果要在指定的位置插入元素则可以用splice
- splice接收多个参数，分别是索引，要删除的元素个数，新加的元素(可多个，用逗号隔开)；
?let myArray=[11,22,33];
?console.log('原数组：',myArray);
?myArray.push(44,55);
?console.log('用push在数组后面插入元素：',myArray);
?myArray.unshift(66,77);
?console.log('用unshift在数组前面插入元素：',myArray);
?myArray.splice(2,0,'12345');
?console.log('用splice在数组指定位置插入元素：',myArray);
64.es6新特性？
1.类
ES6 引入了class（类），让JavaScript的面向对象编程变得更加简单和易于理解。
2.模块化
模块化的功能主要通过export和import组成的。每一个模块都有自己单独的作用域，模块之间的相互调用关系是通过 export 来规定模块对外暴露的接口，通过import来引用其它模块提供的接口。
3.箭头函数
箭头函数的简写规则：
当函数所传的参数只有一个时，可以去掉（）；
当函数只有返回值时，没有其他操作的时候，可以直接去掉{}。
4.函数参数默认值
5.模板字符串
6.解构赋值
解构赋值语法是JavaScript的一种表达式，可以方便的从数组或者对象中快速提取值赋给定义的变量。
（1）.左右两边的结构必须一样；
（2）.右边必须是一个合法的值；
（3）.声明和赋值不能分开。
7.延展操作符
可以在函数调用/数组构造时, 将数组表达式或者string在语法层面展开；还可以在构造对象时, 将对象表达式按key-value的方式展开。
8.对象属性简写
在ES6中允许我们在设置一个对象的属性的时候不指定属性名。
9.Promise
promise的出现是为了解决异步编程的一种解决方法，比纯回调函数更加的优雅。ES6提供了原生的Promise对象，将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。
Promise的特点：
（1）对象的状态不受外界影响。Promise 对象代表一个异步操作，有三种状态：Pending（进行中）、Resolved（已完成，又称 Fulfilled）和 Rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是 Promise 这个名字的由来，它的英语意思就是「承诺」，表示其他手段无法改变。
（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise 对象的状态改变，只有两种可能：从 Pending 变为 Resolved 和从 Pending 变为 Rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果。就算改变已经发生了，你再对 Promise 对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。
缺点：无法取消 Promise，一旦新建它就会立即执行，无法中途取消。其次，如果不设置回调函数，Promise 内部抛出的错误，不会反应到外部。第三，当处于 Pending 状态时，无法得知目前进展到哪一个阶段（刚刚开始还是即将完成）。
10.var、Let与Const
（1）.var可以挂载在window上，而let和const不能
（2）.var存在变量提升，而let和const不存在
（3）let和const会形成块级作用域，暂时性死区。
（4）const 声明一个只读的常量。一旦声明，常量的值就不会改变。这意味着，const一旦声明变量，就必须立即初始化，不能留到以后赋值
（5）.const 命令实际上保证的并不是变量的值不得改动，而是变量指向的那个内存地址不得改动。
65.js对数组有哪些操作方法？
//不修改原数组
* join()、concat()、slice()
//修改原数组
* splice()、reverse()、push()、pop()、unshift()、shift()、sort()
//js高级用法
* forEach()、map()、filter()、find()、findIndex()、copyWithin()
//数组扩展用法
* Array.form()、Array.of()
//不常用方法
* some()、every()、reduce()、reduceRight()、indexOf()、lastIndexOf()、fill()、entries()/keys()/values()、includes()
66.什么是ajax，可以用来做什么？
Ajax（Asynchronous JavaScript and XML）异步JavaScript和XML。 不是一种编程语言 是一种在不需要重新加载整个网页的情况下，能够更新部分页面的技术
作用：用于完成局部刷新 使用场景：需要刷新的页面，如（浏览器地图搜素、自动提示、用户重复检查、购物车、用户登录等.....）都需要用到Ajax交互。
67.讲下你做轮播图的思路，无缝轮播？
1) 在页面图片列表的开始加上最后一张图片的附属图，在最后加上第一张图片的附属图
2) 每次切换时判断切换后的位置是否大于-1610px或是小于-4830px(即是否切换到附属图的位置)：
3）实现圆点按钮点击切换：遍历底部圆点按钮数组，为每个按钮添加点击事件
4） 实现图片自动切换：实现每5s切换图片，图片循环播放；
68.http协议？
http协议的作用及特点
HTTP是一个客户端和服务器端请求和应答的标准（TCP）。客户端是终端用户，服务器端是网站。通过使用Web浏览器、网络爬虫或者其它的工具，客户端发起一个到服务器上指定端口（默认端口为80）的HTTP请求。（我们称这个客户端）叫用户代理（user agent）。应答的服务器上存储着（一些）资源，比如HTML文件和图像。（我们称）这个应答服务器为源服务器（origin server）。在用户代理和源服务器中间可能存在多个中间层，比如代理，网关，或者隧道（tunnels）。尽管TCP/IP协议是互联网上最流行的应用，HTTP协议并没有规定必须使用它和（基于）它支持的层。 事实上，HTTP可以在任何其他互联网协议上，或者在其他网络上实现。HTTP只假定（其下层协议提供）可靠的传输，任何能够提供这种保证的协议都可以被其使用。
通常，由HTTP客户端发起一个请求，建立一个到服务器指定端口（默认是80端口）的TCP连接。HTTP服务器则在那个端口监听客户端发送过来的请求。一旦收到请求，服务器（向客户端）发回一个状态行，比如"HTTP/1.1 200 OK"，和（响应的）消息，消息的消息体可能是请求的文件、错误消息、或者其它一些信息。HTTP使用TCP而不是UDP的原因在于（打开）一个网页必须传送很多数据，而TCP协议提供传输控制，按顺序组织数据，和错误纠正。
通过HTTP或者HTTPS协议请求的资源由统一资源标示符（Uniform Resource Identifiers）（或者，更准确一些，URLs）来标识。
1.基于请求/响应模型的协议。请求和响应必须成对，先有请求后有响应
2.http协议默认端口:80
3.简单快速：客户向服务器请求服务时，只需传送请求方法和路径。请求方法常用的有GET、HEAD、POST。每种方法规定了客户与服务器联系的类型不同。由于HTTP协议简单，使得HTTP服务器的程序规模小，因而通信速度很快。
4.灵活：HTTP允许传输任意类型的数据对象。正在传输的类型由Content-Type加以标记。
5.无连接：无连接的含义是限制每次连接只处理一个请求。服务器处理完客户的请求，并收到客户的应答后，即断开连接。采用这种方式可以节省传输时间。
6.无状态：HTTP协议是无状态协议。无状态是指协议对于事务处理没有记忆能力。缺少状态意味着如果后续处理需要前面的信息，则它必须重传，这样可能导致每次连接传送的数据量增大。另一方面，在服务器不需要先前信息时它的应答就较快。
协议功能
HTTP协议（HyperText Transfer Protocol，超文本传输协议）是用于从WWW服务器传输超文本到本地浏览器的传输协议。它可以使浏览器更加高效，使网络传输减少。它不仅保证计算机正确快速地传输超文本文档，还确定传输文档中的哪一部分，以及哪部分内容首先显示(如文本先于图形)等。
HTTP是客户端浏览器或其他程序与Web服务器之间的应用层通信协议。在Internet上的Web服务器上存放的都是超文本信息，客户机需要通过HTTP协议传输所要访问的超文本信息。HTTP包含命令和传输信息，不仅可用于Web访问，也可以用于其他因特网/内联网应用系统之间的通信，从而实现各类应用资源超媒体访问的集成。
我们在浏览器的地址栏里输入的网站地址叫做URL (Uniform Resource Locator，统一资源定位符)。就像每家每户都有一个门牌地址一样，每个网页也都有一个Internet地址。当你在浏览器的地址框中输入一个URL或是单击一个超级链接时，URL就确定了要浏览的地址。浏览器通过超文本传输协议(HTTP)，将Web服务器上站点的网页代码提取出来，并翻译成漂亮的网页。
?
69.css3新特性？
伪类
1.动态伪类选择器
:link 设置a对象在未被访问前的样式表属性
:visited 设置a对象在其链接地址已被访问过时的样式表属性
:hover 设置对象在其鼠标悬停时的样式表属性
:active 设置对象在被用户激活（在鼠标点击与释放之间发生的事件）时的样式表属性
定义CSS时候的顺序不同，也会直接导致链接显示的效果不同。原因可能在于浏览器解释CSS时遵循的“就近原则”。正确的顺序：a:link、a:visited、a:hover、a:active
2.结构性伪类选择器
:first-child 选择某个元素第一个子元素
:last-child 选择某个元素最后一个子元素
:nth-child() 选择某个元素的一个或者多个特定的子元素
:nth-last-child 选择某个元素的一个或者多个特定的子元素，从这个元素的最后一个子元素开始算
:nth-of--type() 选择指定的元素
:nth-last-of--type() 选择指定的元素，从元素的最后一个开始计算
:first-of-type 选择一个上级元素下的第一个同类子元素
:last-of-type 选择一个上级元素下的最后一个同类子元素
:only-of-type 选择的是它父元素唯一一个子元素
:empty 选择的元素里面没有内容
3.伪元素
:first-letter ? 将特殊的样式添加到文本的首字母
:first-line ? ?将特殊的样式添加到文本的首行
:before ? 在某些元素之前插入某些内容
:after ? ?在某些元素之后插入某些内容
色彩
1.透明
opacity:value? ? ? ?----->? (0-1)
2.颜色
rgba(R, G, B, A)
| R | 正整数 | 百分数 | | G | 正整数 | 百分数 | | B | 正整数 | 百分数 | | A | Alpha 透明度 ( 0~1 ) |
3.线性渐变
linear-gradient（）
4.径向渐变
radial-gradient（）
css3实现三角形、菱形、平行四边形等
盒子阴影效果
box-shadow : h-shadow v-shadow blur spread color inset;
过渡
transition: property duration delay timing-function;
动画
@keyframes配合animation使用
文字排版?
制作字体阴影
text-shadow: h-shadow v-shadow blur color;?
新增字体单位rem
相对于应用<html>根元素的字体尺寸 。
70.css选择器的权重？
总体来说：内联样式 > id>class=属性选择器=伪类选择器=伪元素选择器>标签，大致分为四个等级：
一等：代表内联样式，如: style=””，权值为1000；
二等：代表ID选择器，如：#content，权值为100；
三等：代表类，伪类和属性选择器，如.content，权值为10；
四等：代表类型选择器和伪元素选择器，如div p，权值为1；
71.js数据类型？
? 基本类型（单类型）：除Object。?String、Number、boolean、null、undefined。
? ? 引用类型：object。里面包含的 function、Array、Date。
72.减少页面加载时间的方法？
1、减少http请求（合并文件、合并图片）
2、优化图片文件，减小其尺寸，特别是缩略图，一定要按尺寸生成缩略图然后调用，不要在网页中用resize方法实现，虽然这样看到的图片外形小了，但是其加载的数据量一点也没减少。曾经见过有人在网页中加载的缩略图，其真实尺寸有10M之巨…普通图像、icon也要尽可能压缩后，可以采用web图像保存、减少颜色数等等方法实现。
3、图像格式的选择（GIF：提供的颜色较少，可用在一些对颜色要求不高的地方）
4、 压缩Javascript、CSS代码：一般js、css文件中存在大量的空格、换行、注释，这些利于阅读，如果能够压缩掉，将会很有利于网络传输。这方面的工具也有很多，可以在百度里搜索一下关键字“css代码压缩”，或者“js代码压缩”将会发现有很多网站都提供这样的功能，当然了你也可以自己写程序来做这个工作，如果你会的话。就拿我们这个网站来说吧。刚开始上传这个网站的时候，我的很多Css代码都没有压缩，后面发现了这个问题，我就上网找了相关的网站的压缩代码的功能，最后就把很多CSS文件都压缩了。这个压缩比率还是比较高的，一般都有百分五十左右。这个代码压缩对于网页的加载还是很有用的。
5、 服务器启用gzip压缩功能：将要传输的文件压缩后传输到客户端再解压，在网络传输 数据量会大幅减小。在服务器上的Apache、Nginx可直接启用，也可用代码直接设置传输文件头，增加gzip的设置，也可从 负载均衡设备直接设置。不过需要留意的是，这个设置会略微增加服务器的负担。服务器性能不是很好的网站，要慎重考虑。
6.标明高度和宽度（如果浏览器没有找到这两个参数，它需要一边下载图片一边计算大小，如果图片很多，浏览器需要不断地调整页面。这不但影响速度，也影响浏览体验。 当浏览器知道了高度和宽度参数后，即使图片暂时无法显示，页面上也会腾出图片的空位，然后继续加载后面的内容。从而加载时间快了，浏览体验也更好了。）
7、网址后面加上“/”:对服务器而言，不加斜杠服务器会多一次判断的过程，加斜杠就会直接返回网站设置的存放在网站根目录下的默认页面。
8、在文件头部放置css样式的定义
9、文件末尾放Javascript脚本?
网页文件的载入是从上到下加载的，很多Javascript脚本执行效率较低，或者在网页前面都不需要执行的，如果将这些脚本放置到页面比较靠前的位置，可能导致网站内容载入速度下降或加载不了，将这些脚本放置在网页文件末尾，一定要放 置在前面的脚本要改用所谓的“后载入”方式加载，在主体网页加载完成后再加载，防止其影响到主体网页的加载速度。
10、 Ajax采用缓存调用?
Ajax调用都采用缓存调用方式，一般采用附加特征参数方式实现，注意其中的<script src=”xxx.js?{VERHASH}”，{VERHASH}就是特征参数，这个参数不变化就使用缓存文件，如果发生变化则重新下载新文件或更新信息。
11、 尽可能减少DCOM元素?
这个很好理解，就是尽可能减少网页中各种<>元素数量，例如<table>的冗余很严重，而我们完全可以用<div>取代之。
12、 使用多域名负载网页内的多个文件、图片
13、 使用CDN
14、在服务器端配置control-cache last-modify-date
15、在服务器配置Entity-Tag if-none-match
73.怎么理解模块化开发？
所谓的模块化开发就是封装细节，提供使用接口，彼此之间互不影响，每个模块都是实现某一特定的功能。模块化开发的基础就是函数
（一）使用函数封装
（二）使用对象封装
可以把模块写成一个对象，所有的模块成员都放到这个对象里面。
（三）立即执行函数写法
使用”立即执行函数”（immediately-invoked FunctionExpression，IIFE），可以达到不暴露私有成员的目的。这个也是闭包处理的一种方式。
（四）放大模式
如果一个模块很大，必须分成几个部分，或者一个模块需要继承另一个模块，这时就有必要采用”放大模式”（augmentation）。在原有的基础上扩展更多的方法。
（五）宽放大模式（Loose augmentation）
在浏览器环境中，模块的各个部分通常都是从网上获取的，有时无法知道哪个部分会先加载。如果采用上面的写法，第一个执行的部分有可能加载一个不存在空对象，这时就要采用”宽放大模式”。
（六）输入全局变量
独立性是模块的重要特点，模块内部最好不与程序的其他部分直接交互。为了在模块内部调用全局变量，必须显式地将其他变量输入模块。
74.什么是闭包，有什么作用？
1、变量作用域
要理解闭包，首先要理解javascript的特殊的变量作用域。
变量的作用域无非就两种：全局变量和局部变量。
javascript语言的特别之处就在于：函数内部可以直接读取全局变量，但是在函数外部无法读取函数内部的局部变量。
注意点：在函数内部声明变量的时候，一定要使用var命令。如果不用的话，你实际上声明的是一个全局变量！
2、如何从外部读取函数内部的局部变量？
出于种种原因，我们有时候需要获取到函数内部的局部变量。但是，上面已经说过了，正常情况下，这是办不到的！只有通过变通的方法才能实现。
那就是在函数内部，再定义一个函数。
3、闭包的用途
闭包可以用在许多地方。它的最大用处有两个，一个是前面提到的可以读取函数内部的变量，另一个就是让这些变量的值始终保持在内存中，不会在f1调用后被自动清除。
75.transition transform translate 之间的区别 transform的属性有哪些？
01.transform(转换) 和 translate
????????transform的中文翻译是变换、变形，是css3的一个属性，和其他width，height属性一样
translate 是transform的属性值，是指元素进行2D变换，2D变换就是指，元素以当前位置（0,0）按照x轴的方向移动多少，按照y轴的方向移动多少
例如：
transform：translate(0,100%)表示从元素的当前位置延y轴方向，向下移动整个元素高度的距离
transform：translate(-20px,0) 表示从元素的当前位置延x轴方向，向左移动20px
transform 有很多其它属性值
translate3D定义 3D 转换
scale 定义 2D 缩放转换
rotate 定义 2D 旋转，在参数中规定角度
skew 定义沿着 X 和 Y 轴的 2D 倾斜转换
02.transition(过渡)
????????transition 在一定时间之内，一组css属性变换到另一组属性的动画展示过程。可以用来实现动态效果，css3的属性
语法 transition：需要变换的属性 变换需要的时间 控制动画速度变化 延期多少时间后开始执行
transition-property规定应用过渡的 CSS 属性的名称。?
transition-duration 定义过渡效果花费的时间。默认是 0。
transition-timing-function 规定过渡效果的时间曲线。默认是"ease"。
transition-delay 规定过渡效果何时开始。默认是 0。
transition属性写在最初的样式里，而不是放在结束的样式里，即定义动画开始之前的元素外观的样式。只需要给元素设置一次transition，浏览器就会负责以动画展示从一个样式到另一个样式。
例如：
transition:width 2s;
transition:translate 2s;
transtion:all 2s;
transform的属性：
translate：平移? ??rotate：旋转? ??scale：缩放? ? ?
76.css3中的选择器？
77.html5新特性 css3？
1.html5的新特性：
1.添加了video，radio标签
2.添加了canvas画布和svg,渲染矢量图片
3.添加了一些列语义化标签header,footer,main,section,aside,nav等
4.input的type值新添加了很多属性（email，url，number，range，Date pickers (date, month, week, time, datetime, datetime-local)，search，color）
5.添加了地理位置定位功能 Geolocation API
6.添加了web存储功能，localStorage和sessionStorage
7.使用 HTML5，通过创建 cache manifest 文件，可以轻松地创建 web 应用的离线版本
8.web worker 是运行在后台的 JavaScript，独立于其他脚本，不会影响页面的性能。您可以继续做任何愿意做的事情：点击、选取内容等等，而此时 web worker 在后台运行。
9.服务端事件推送（EventSource 对象用于接收服务器发送事件通知），所有主流浏览器均支持服务器发送事件，除了 Internet Explorer
2.CSS3中新添加的特性：
1.媒体查询（可以查询设备的物理像素然后进行自适应操作）
2.transform，transition，translate,scale,skelw，rotate等相关动画效果
3.box-shadow,text-shadow等特效
4.CSS3 @font-face 规则,设计师可以引入任意的字体了
5.CSS3 @keyframes 规则，可以自己创建一些动画等
6.2D、3D转换
7.添加了border-radius，border-image等属性
8.CSS3 创建多列（column-count规定文本可以以几列的方式布局）
9.CSS3 用户界面（resize，box-sizing，outline-offset）
78.定时器 settimeout和setinterval的区别，如果用settimeout实现每隔一定的时间就执行一次，怎么实现？
区别：
setTimeout只在指定时间后执行一次，
setInterval以指定时间为周期循环执行，
一般情况下setTimeout用于延迟执行某方法或功能，
setInterval则一般用于刷新表单，对于一些表单的假实时指定时间刷新同步
销毁两种定时器方法：
//清除Timeout的定时器,
传入id(创建定时器时会返回一个id) clearTimeout(i);
//清除Interval的定时器,
传入id(创建定时器时会返回一个id) clearInterval(j);
实现每隔一定的时间就执行一次：
//每5秒使用Ajax取一次数据
setTimeout(function(){
?? ?var f = arguments.callee;
?? ?$.post('/3G/wall/ajax_vote/',
?? ??? ?{
?? ??? ? ? ?client_id : <?php echo $memberId;?>,
?? ??? ? ? ?vote_id: <?php echo $vote_id;?>
?? ??? ?},
?? ??? ?function(data){
?? ??? ??? ?setTimeout(f,5000);//一定要加这一行
?? ??? ??? ?if(!data) return;
?? ??? ??? ?var res = JSON.parse(data);
?? ??? ??? ?$(".list_vote").append(res);?? ??? ??? ?
?? ??? ?}
?? ?)
},5000);
79.bookstrap栅格系统，你怎么理解栅格系统？
响应式网格系统随着屏幕或视口（viewport）尺寸的增加，系统会自动分为最多12列。（row）
解释：
col-xs- ? ? 对应超小设备（屏幕<768 px ）手机
col-sm- ? ?对应小型设备（屏幕>768 px 屏幕<992 px ）平板电脑
col-md- ? 对应中型设备（屏幕>992 px 屏幕<1200 px ）台式电脑
col-lg- ? ? 对应大型设备（屏幕>1200 px）台式电脑
1、col-xs-12就是在屏幕小于768px时，图片会在横向上充满，占据整个div
2、在col-xs-0 col-sm-2 col-md-2 这个div內，我什么都没写，但是在屏幕大于768px的时候，这个div会占据一部分大小。可以理解为就是一个有一定大小的空的div（就是用来占位置的）
3、因为既要适应手机端，还有电脑端，就把这几个类名都写在一起，在屏幕大小改变的时候，会自动调到对应的样式
@media 可以针对不同的屏幕尺寸设置不同的样式，特别是如果你需要设置设计响应式的页面，@media 是非常有用的。?
col-xs- 、col-sm- 、 col-md-......这些类名背后对应的样式就是通过@media来实现的！！！！！
80.localstorage和sessionstorage的区别？
localStorage和sessionStorage一样都是用来存储客户端临时信息的对象。
他们均只能存储字符串类型的对象（虽然规范中可以存储其他原生类型的对象，但是目前为止没有浏览器对其进行实现）。
localStorage生命周期是永久，这意味着除非用户显示在浏览器提供的UI上清除localStorage信息，否则这些信息将永远存在。
sessionStorage生命周期为当前窗口或标签页，一旦窗口或标签页被永久关闭了，那么所有通过sessionStorage存储的数据也就被清空了。
不同浏览器无法共享localStorage或sessionStorage中的信息。相同浏览器的不同页面间可以共享相同的 localStorage（页面属于相同域名和端口），但是不同页面或标签页间无法共享sessionStorage的信息。这里需要注意的是，页面及标 签页仅指顶级窗口，如果一个标签页包含多个iframe标签且他们属于同源页面，那么他们之间是可以共享sessionStorage的。
?
|