共计 2967 个字符，预计需要花费 8 分钟才能阅读完成。
一面
1. 自我介绍
2. jQuery 的选择器
jQuery 的选择器与 css 中的选择器很相似，通过使用 css 中的选择器来选取 HTML 节点
1. #id
用法: $(“#myDiv”); 返回值 单个元素的组成的集合
说明: 这个就是直接选择 html 中的 id=”myDiv”
2. Element
用法: $(“div”) 返回值 集合元素
说明: element 的英文翻译过来是”元素”, 所以 element 其实就是 html 已经定义的标签元素, 例如 div,
input, a 等等.
3. class
用法: $(“.myClass”) 返回值 集合元素
说明: 这个标签是直接选择 html 代码中 class=”myClass” 的元素或元素组 (因为在同一 html 页面中
class 是可以存在多个同样值的 )
4. *
用法: $(“*”) 返回值 集合元素
说明: 匹配所有元素, 多用于结合上下文来搜索
5. selector1, selector2, selectorN
用法: $(“div,span,p.myClass”) 返回值 集合元素
说明: 将每一个选择器匹配到的元素合并后一起返回. 你可以指定任意多个选择器, 并将匹配到的元素合
并到一个结果内。其中 p.myClass 是表示匹配元素
p class=”myClass”
其次可以使用属性选择器，例如 input 中的 name，type 属性等
1、[attribute]
用法: $(“div[id]”) ; 返回值 集合元素
说明: 匹配包含给定属性的元素。例子中是选取了所有带”id”属性的 div 标签。
2、[attribute=value]
用法: $(“input[name=’newsletter’]”).attr(“checked”, true); 返回值 集合元素
说明: 匹配给定的属性是某个特定值的元素. 例子中选取了所有 name 属性是 newsletter 的 input 元素。
3、[attribute!=value]
用法: $(“div[title!=’test’]”).css(“background”,”yellow”); 返回值 集合元素
说明: 匹配所有不含有指定的属性，或者属性不等于特定值的元素。
此选择器等价于:not 此选择器等价于:not([attr=value]), 要匹配含有特定属性但不等于特定值的元素, 请使用 [attr]:not([attr=value])。之前看到的:not 派上了用场。
4、[attribute^=value]
用法: $(”input[name^=‘news’]“) 返回值 集合元素
说明: 匹配给定的属性是以某些值开始的元素., 我们又见到了这几个类似于正则匹配的符号。
5、[attribute$=value]
用法: $(“input[name$=’letter’]”) 返回值 集合元素
说明: 匹配给定的属性是以某些值结尾的元素。
6、[attribute*=value]
用法: $(“input[name*=’man’]”) 返回值 集合元素
说明: 匹配给定的属性是以包含某些值的元素。
7、[attributeFilter1][attributeFilter2][attributeFilterN]
用法: $(“input[id][name$=’man’]”) 返回值 集合元素
说明: 复合属性选择器, 需要同时满足多个条件时使用. 又是一个组合, 这种情况我们实际使用的时候很常用. 这个例子中选择的是所有含有 id 属性, 并且它的 name 属性是以 man 结尾的元素。
其他具体可以查看 JQuery_九大选择器
3. 如何寻找子元素 a 的父元素中带 class=”abc” 的兄弟节点
<div>
<div class=”abc”>
<div>
<div class=”abc”>
<div>
<a href=”#”> 点击我！！！</a>
</div>
</div>
<div class=”abcs”></div>
<div class=”abcs”></div>
</div>
</div>
<div class=”abcs”></div>
<div class=”abcs”></div>
</div>
我的想法是首先寻找 a 标签的全部祖先元素 $(“a”).parents()，然后找到其中 class=”abc” 的元素 $(“a”).parents().filter(“.abc”)，最后再找到这些节点的兄弟节点即可 $(“a”).parents().filter(“.abc”).siblings()
4. 写一个简单的 jQuery 插件（打印 ”Hello World”）
这个主要有两种方法
类级别开发插件
对象级别开发
// 一、类级别开发插件
// 1. 直接给 jquer 添加全局函数
jQuery.printHelloWorld = function(){
console.log(“Hello World!!!”);
}
// 2. 用 extend() 方法。extend 是 jquery 提供的一个方法，把多个对象合并起来，参数是 object
$.extend({
printHelloWorld:function(){
console.log(“Hello World!!!”);
}
})
// 3. 使用命名空间 (如果不使用命名空间容易和其他引入的 JS 库里面的同名方法冲突)
jQuery.test = {
printHelloWorld: function () {
console.log(“Hello World!!!”);
}
}
// 调用
$.printHelloWorld();
$.test.printHelloWorld();
// 二、对象级别开发
// 第一行的; 一定要写
;(function($){
$.printHelloWorld = function(){
console.log(“Hello World!!!”);
}
}(jQuery))
// 调用
$.printHelloWorld();
5. 跨域的解决方法
经典问题，具体参考深入理解前端跨域问题的解决方案
6. ES6 有了解吗
7. Promise 解决了什么问题
Promise 主要解决了回调地狱的问题。
8. 你觉得 Promise 能解决回调地狱吗？
9. 现在有两个字符串 var a = “aaa” 和 var b = “bbb 如何不借助任何函数和中间变量交换他们
这里只写一个相对比较万能的方法，其他可以参考 JavaScript 交换两个变量值的七种解决方案
var a = “aaa”;
var b = “bbb”;
a = [b, b=a][0];
// 根据运算符优先级，首先执行 b =a，此时的 b 直接得到了 a 的变量值，然后一步数组索引让 a 得到了 b 的值
10. vue 中 vuex 的 action 和 mutation 区别
Action 提交的是 mutation，而不是直接变更状态。Action 可以包含任意异步操作，而 Mutation 必须是同步函数。
11. localStorage 和 SessionStorage 区别
localStorage 的生命周期是永久性的; sessionStorage 的生命周期是在浏览器关闭前
12. 有一个数据，应该在 vue 中的哪个钩子函数中执行？
13. 如果数据量很大，在 created 执行会不会很慢？
14. 有了解过多页面吗？有处理过自适应呢？
15. 为什么想做前端？
16. 自我驱动？数据驱动？
二面
1. 暑假实习过？
2. 实习主要工作内容？
3. 有做过前端的相关的插件或组件吗？
4. 怎么理解 Vue 开发？
5. 实习的时候做怎样的系统？
6. 怎么理解 Vue 开发？
