js前端面试题

待我称王封你为后i 2022-05-10 08:58 183阅读 0赞

浮动模型  
1.浮动的标签只能被具有文本特性的标签所看到(，即display：inline/inline-block)或者触发bfc的标签(position:absolute,overflow:hidden,float:left/right)

第二阶段 JavaScript、jQuery、ECMAScript、JSON  
1、jQuery this与this区别  
this是javascript自身的语法关键字，它指向一个javascript对象。  
`$(this), 将javascript 对象包装成为一个jquery对象，是一个JQuery对象。`  
2、input name值为a与p name值为a 这两个如何用jQuery定位到input  
`$('input:[name=='a']')`  
3、请描述一下 cookies，sessionStorage 和 localStorage 的区别？  
(1)有效期(2)cookie将数据自动传给服务器，服务器也可以写cookie到客户端，storage不会自动将数据传给服务端，保存在本地(3)大小  
4、对BFC规范的理解？

5、JavaScript原型，原型链 ? 有什么特点？  
6、说几条写JavaScript的基本规范？  
7、null，undefined 的区别？  
8、谈谈This对象的理解。  
9、事件是？IE与火狐的事件机制有什么区别？ 如何阻止冒泡？  
10、什么是闭包（closure），为什么要用它？  
11、new操作符具体干了什么呢?  
12、JavaScript中的作用域与变量声明提升？  
13、如何编写高性能的Javascript？  
14、那些操作会造成内存泄漏？  
15、你遇到过比较难的技术问题是？你是如何解决的？  
16、常使用的库有哪些？常用的前端开发工具？开发过什么应用或组件？  
17、页面重构怎么操作？  
18、什么叫优雅降级和渐进增强？  
19、WEB应用从服务器主动推送Data到客户端有那些方式？  
20、编程实现javascript在String中写一个trim，要求能够去除一个字符串开始和结尾的空格  
21、json的了解及用法，与xml有何不同？  
22、一个页面从输入url 到页面加载显示完成，这个过程中都发生什么了  
23、javascript如何创建一个对象，？\{画出次对象的内存图\}  
24、juery中如何将数组转化为json字符串，然后在转化回来  
25、说一说 最近流行的一些新的东西 》常去哪些网站？  
26、给juery扩展一个新的空方法，方法名称为newFunc  
27、编程实现使用JavaScript实现一个深拷贝方法  
28、请写出超链接的顺序或你在初级样式中的连接方法  
29、函数几种定义方法  
30、JavaScript的typeof 返回哪些数据类型  
31、写一个获取非行间样式的函数  
32、时间委托是什么 有什么好处  
33、jquery 中哪几种类型选择器？  
34、闭包是什么 有什么特性 对页面有什么影响  
35、如何阻止事件冒泡和默认事件  
36、添加 删除 替换 插入 到某个节点的方法  
37、解释json 的原理 以及为什么不是真正的ajax  
38、JavaScript的本地对象，内置对象和宿主对象  
39、js编写一个数组去重的方法  
40、split（）join（）的 区别 数组方法pop（）push（）unshift（）shift（）  
41、事件绑定和普通绑定有什么区别  
42、ECMAScript和JavaScript的区别？  
43、break和continue区别？  
44、字符串中substring、substr、slice区别？  
45、清除字符串前后空格，要兼容所有浏览器？  
46、push、pop、shift和unshift 区别？  
47、数组和字符串之间的转换方式？  
48、数组排序？  
49、自执行函数两种写法？  
50、取10-100之间的一个随机数？取“a-zA-Z”中的4个随机数？  
51、输出当前日期的前一天？（2016-5-17，则输出2016-5-16）  
52、js中选择器的几种方法？  
53、创建节点方法？  
54、DOM 0级和2级事件的写法、清除方法及优缺点？  
55、target和currentTarget区别？  
56、数组去重方法？  
57、回流和重绘的解释、关系及区别？  
58、怎样能减少页面的回流和重绘？  
59、两种定时器的写法及清除？  
60、判断是手机还是PC？  
61、获取数组中的最大值？  
62、写一个改变this指向的闭包？  
63、使用正则写一个验证邮箱的表达式？  
64、sessionStorage、localStorage、cookie的区别？  
65、添加、删除、替换、插入到某个节点的方法？  
66、写一个继承方法？  
67、写出this指向的几种情况？  
68、XTMHTTPRequest的readystate的五种状态？  
69、status返回的窗口状态栏文本类型？（或http的状态码？）  
70、写一个ajax使用get请求数据的全套代码？  
71、URL参数截取？  
72、js中如何对特殊符号进行转码与编码。  
73、在什么情况下你会用ajax请求来代替通常的跳转。  
74、谈谈你对跨域访问的认识，写出两个实现跨域访问页面的的方法。  
75、列出你所知道的设计模式并简述。  
76、javascr中有哪些数据类型；  
77、截取字符串abcde中的cde；  
78、什么是闭包，请举例说明；  
79、一个dom节点被点击的时候，我们希望能够执行一个函数，应该怎么做；  
80、请写一个javascript函数parseQueryString，他的用途是吧url参数解析为一个对象，如：  
var url = “[http://www.test.com/index.php?key0=0&key1=1&key2=2”][http_www.test.com_index.php_key0_0_key1_1_key2_2]  
81、怎样添加移除、移动、复制、创建和查找节点？  
82、在javascript中什么是伪数组，如何将伪数组转化为标准数组；  
83、手写数组快速排序；  
84、统计字符号串“aaaabbbccccddfggh”中字母个数或统计最多字母数；  
85、写一个function，清楚字符串前后的空格（兼容所有浏览器）  
86、实现一个函数clone，可以对javascript中5种主要的数据类型（包括number string object array boolean）进行值复制；  
87、将数组【“a”，“b”，“c”】转化为字符串；  
88、获取enent目标对象的方法（要求兼容性）；  
89、介绍js基本数据类型；  
91、javascript中“use strict”是什么意思，为什么要使用；  
92、描述一下javascript 的作用域链；  
95、判断一个字符串中各个字符出现的次数；例如字符串：hello 处理后：h：1 e：1 l:2 0:1  
96、编写一个方法，判断字符串是否是这样组成的，第一个必须为数字，最后一个必须为 字母  
97、编写一个方法，出去数组中的重复的元素：例如数字【“ab”，“ab”，“ac”，“cd”】 处 理后、：【“ab”，“ac”，“cd”】  
98、如何隐藏一个dom元素  
99、javascript 中有哪些基础数据类型  
100、如何添加HTML事件，有几种方法？（至少两种方式）  
101、javascript 面向对象中继承实现方式  
102、javascript 中如何让对一个对象进行深拷贝？  
103、为什么异步加载js文件？加载方式？（至少两种方式）  
104、前端常规开发优化策略（至少两种方式）  
105、如何控制网页在网络传输过程中的数据量  
106、var stringArray = \[ “this”,“is”,“chunchujie”\]，请在控制台输出“this is chunchujie”。  
107、请写一个函数去除数组的重复项、；如\[2008,34,78,2,45,34,78,90,90,12,34\]处理后为\[20 0 8.34，78,2,45,90,12\]  
108、用js或jQuery获取id为chuchujie的div里边的所有a标签，并把字体大小设置为18px；同 时把第三个a标签设置为块级元素，并把他的宽高分别设置为300px和500px；  
109、请在网页上输出九九乘法表；  
110、call 和apply的区别是什么？  
111、请解释jsonp的工作原理  
112、请简要说明javascript 中this 是如何让工作的的  
113、请谈谈你都使用过哪些javascript模板  
114、你怎么看AMD vs.Commonjs?  
115、使用Promises 而非回调（callbacks）优缺点是什么？  
116、如何实现下列代码：  
var number =\[ 1,2,3,4,5\];  
number.square();//\[1,4,9,16,25\]  
number.average();//3  
number.sum();//15  
number.even()?/\[2,4\]  
117、请实现一个为数组去重的函数  
118、请使用任意一种mvvm框架演示如何实现双向绑定  
119、svg 与canvas的不同  
120、localhost与sessionStorage的不同  
121、js获取来源页地址显示在页面上；  
122、jQuery Mobile 是什么  
123、输出今天的日期，以YYYY-MM-DD的方式，比如今天是2016年10 月26日，则输出2016- 10-26.  
124、怎样添加、移除、移动、复制、创建和查找结点（原生js）。  
125、原生JS的window.onload与jquery的$(document).ready(function()\{\}) 有什么不同？  
126、想实现一个对页面某个结点的拖拽？如何做？（使用原生JS）。  
127、JavaScript原型，原型链？  
128、jquery与jQuery UI有什么区别？  
129、对Node的有点和缺点提出自己的看法？  
130、一个div宽高100px，点击变大，当它的宽高等于400px开始缩小，当宽高缩小至100px时， 开始放大；再次点击暂定缩小或放大，再再次点击，div继续放大或缩小。  
131、静态资源CDN如何使用。  
132、用JS手写快速排序  
133、Postcss是啥  
134、Java和Javascript的共同点  
135、截取abcdefg的efg  
136、判断一个字符串中出现次数最多的字符，统计这个次数。  
137、规避javascript多人开发函数重名问题  
138、Javascript面向对象中继承实现  
139、编写一个方法，去掉一个数组的重复元素  
140、Javascript中如何检测一个变量事一个string类型？请写出函数实现  
141、请尽可能详尽的解释AJXA的工作原理  
142、 下面这段代码的运行结果是什么？  
Function hi()\{  
Var a;  
Alert(a);  
\}  
143、下面这段代码的运行结果是什么？  
Var b;  
Function a()\{  
Var a=”a”;  
B = function()\{  
Return a+”B”;  
\}  
Return a;  
\}  
Alert(a());  
Alert(B());  
144、下面这段代码的运行结果是什么？  
（1）console.dir(0false);  
（2）Console.dir(1true);  
（3）Console.dir(2==\{valueOf: function( )\{return 2\}\});  
（4）Console.dir(aNaN);  
（5）Console.dir(NaNNaN);  
（6）Console.dir(8undefined);  
（7）Console.dir(1undefined);  
（8）Console.dir(2==\{toString:function()\{return2\}\});  
（9）Console.dir(undefinednull);  
（10）Console.dir(null1);  
（11）Console.dir(\{toString:function()\{return1\},valueOf:function()\{return \[\]\}\});  
（12）Console.dir(1==”1”);  
（13）Console.dir(1===”1”);  
145、Null,undefined的区别？  
146、\[2,6,7\]和\[3,5,8\] => \[2,3,5,6,7,8\]  
至少两种方法实现  
147、将一个十六进制字符串转换为十进制数  
ABC123  
148、比较一下jQuery,Angular.js,React.js 等框架的优缺点。  
149、请描述一下cookies，sessionStorage和localStorage的区别？  
150、下面这段代码的运行结果是什么？  
var a =3;  
Function test()\{  
var b = 2;  
c = 5;  
Alert(a);  
\}  
alert©//结果是什么：  
test()//结果是什么：  
151、下面这段代码的运行结果是什么？  
var arr = \[1,2,3,4,ture,’abc’,new Date()\];  
arr.length = 5;  
alert(arr);  
152、下面这段代码的运行结果是什么？  
var arr=\[1,2,3,4,5\];  
arr.splice(1,2,3,4,5);  
alert(arr);  
153、输出字符‘asdfaasfgpojgajgagjk’中出现次数最多的字符及出现的 次数。  
154、合并数组\[4,1,3,9,6,2\]和\[8,5,3,2,1,4,7\]，然后去重，取出偶数倒排。  
155、简述什么是面向对象。  
156、简述ajax过程。  
157、解释下时间代理。  
158、解释下javascript中this是如何工作的。  
159、解释下原型继承的原理。  
160、Call和.apply的区别是什么。  
161、什么是”use strict”，使用它的好处是什么。  
162、事件绑定和普通事件有什么区别  
163、请用jquery和原生js分别实现添加、移除、移动、复制、创建和查找DOM结点。  
164、实时监测用户在input内输入的字符数应该监听哪个事件。  
165、介绍下javascript原型，原型链的特点。  
166、1、单项链表逆序  
a) 创建一个单项链表。每一节点包含一个整数作为其数据内容。  
b) 打印输出这个链表（每一个结点的数据内容）  
c) 通过适当的操作使这个链表反序（不能另外创建新的链表）。并打印输出反序后的结果。  
d) 销毁这个链表  
167、判断一个字符串中出现次数最多的字符，统计这个次数。  
168、JS判断数据类型的方法。  
169、jquery怎样获取div的id为‘content’的文本内容。  
170、如何阻止事件冒泡和默认事件，用js原生代码说明。  
171、js中如何对特殊符号进行转码与编码。  
172、谈谈你对跨域访问的认识，写出两个实现跨域访问页面的的方法。  
173、列出你所知道的设计模式并简述。  
174、javascr中有哪些数据类型；  
175、截取字符串abcde中的cde；  
176、什么是闭包，请举例说明；  
177、一个dom节点被点击的时候，我们希望能够执行一个函数，应该怎么做；  
178、请写一个javascript函数parseQueryString，他的用途是吧url参数解析为一个对象， 如：var url = “[http://www.test.com/index.php?key0=0&key1=1&key2=2”][http_www.test.com_index.php_key0_0_key1_1_key2_2]  
179、怎样添加移除、移动、复制、创建和查找节点？  
180、在javascript中什么是伪数组，如何将伪数组转化为标准数组；  
181、手写数组快速排序；

182、统计字符号串“aaaabbbccccddfggh”中字母个数或统计最多字母数；  
183、写一个function，清楚字符串前后的空格（兼容所有浏览器）

function deleteTrim(str) { if(String.prototype.trim) { return str.trim(); }else { return str.replace(/(^\s+)|(\s+$)/g,""); } }

184、实现一个函数clone，可以对javascript中5种主要的数据类型（包括number string object array boolean）进行值复制；

185、将数组\[“a”，“b”，“c”\]转化为字符串；  
186、获取enent目标对象的方法（要求兼容性）；  
一：万能的同样的方法是：传递参数event（实参必须写event换其他名称不行）方式。  
二：window.event适用于ie和google浏览器火狐不支持。  
三：arguments.callee.caller.arguments\[0\]仅火狐和google支持，ie不支持这种获取方式。

function (e) {
       var this.event = e || window.event || arguments.callee.caller.arguments[0]
    }

188、null undefined 的区别；  
1.含义不同：当声明的变量还未被初始化时，变量的默认值为undefined；null用来表示尚未存在的对象，常用来表示函数企图返回一个不存在的对象。  
2.typeof null是object，undefine是undefine  
189、javascript中“use strict”是什么意思，为什么要使用；  
严格模式，严格模式是一种将更好的错误检查引入代码中的方法。 在使用严格模式时，无法使用隐式声明的变量、将值赋给只读属性或将属性添加到不可扩展的对象等 ，严格模式的目的：  
1.消除Javascript语法的一些不合理、不严谨之处，减少一些怪异行为；2.消除代码运行的一些不安全之处，保证代码运行的安全；3.提高编译器效率，增加运行速度；4.为未来新版本的Javascript做好铺垫  
190、描述一下javascript 的作用域链；  
\[\[scope\]\]:每个javascript函数都是一个对象，对象中有些属性我们可以访问，但有些不可以，这些属性仅供javascript引擎存取，\[\[scope\]\]就是其中一个。\[\[scope\]\]指的就是我们所说的作用域,其中存储了运行期上下文的集合。一个函数被定义时，他的\[\[scope\]\]指向的对象（scope chain）的第0位存储的就是该函数所在的执行环境  
作用域链：\[\[scope\]\]中所存储的执行期上下文对象的集合，这个集合呈链式链接，我们把这种链式链接叫做作用域链。  
191、写一个正则，验证电话号码：格式为：“区号-号码”其中区号是010或者20N、0NNN， 电话号码是7-8位数字。

/^(010|20N|0NNN)\-\d{7,8}$

192、编写一个方法，出去数组中的重复的元素：例如数字\[“ab”，“ab”，“ac”，“cd”\] 处 理后、：\[“ab”，“ac”，“cd”\]  
(1)set;(2)indexOf;(3)splice  
193、如何隐藏一个dom元素  
设置元素的opacity值为0  
设置元素的visibility值为hidden  
设置元素的display值为none  
设置元素的position值为absolute，并且将其移到不可见区域  
将元素的font-size、line-height、width和height设置为0  
194、document.write、innerHTML和innerText 的区别？  
document.write会将页面上的所有内容清除包括标题。  
innerHTML从对象的起始位置到终止位置的全部内容重写,包括Html标签。  
innerText:从起始位置到终止位置的内容, 但它去除Html标签  
195、javascript 中有哪些基础数据类型  
Number,String,Boolean,undefined,null  
196、如何添加HTML事件，有几种方法？（至少两种方式）  
(1)内联

(2)on； (3)addEventListener  
197、javascript 面向对象中继承实现方式  
198、javascript 中如何让对一个对象进行深拷贝？  
(1)JSON.stringify(json.parse(obj))；(2) for循环；  
199、为什么异步加载js文件？加载方式？（至少两种方式）  
(1)async/defer (2)回调函数 (3)定时器 (4)promise  
200、用js或jQuery获取id为chuchujie的div里边的所有a标签，并把字体大小设置为18px；同 时把第三个a标签设置为块级元素，并把他的宽高分别设置为300px和500px；  
201、请在网页上输出九九乘法表；

for(var i = 1; i < 10; i ++) {
                for(var j = 1; j <= i; j++) {
                    document.write(j + '*' + i + '=' + i*j);
                    document.write(' ');
                }
                document.writeln('<br>')
            }

202、call 和apply的区别是什么？  
203、请解释jsonp的工作原理  
204、请简要说明javascript 中this 是如何让工作的的  
205、请说出至少三种减少页面加载时间的方法。（加载时间是指感知的时间或者实际加载的时间）  
206、请描述你曾使用过的css预处理器的优缺点  
207、请谈谈你都使用过哪些javascript模板  
208、你怎么看AMD vs.Commonjs?

[http_www.test.com_index.php_key0_0_key1_1_key2_2]: http://www.test.com/index.php?key0=0&key1=1&key2=2%E2%80%9D