2019最新前端JavaScript面试题集锦（二）（满满都是干货）
40.typeof运算符返回值中有一个跟javascript数据类型不一致，它是？如何判断是不是数组？
Array，Array.isArray(data)
41.写出函数DateDemo的返回结果，系统时间假定为今天
function DateDemo(){
var d, s="今天日期是：";
d = new Date();
s += d.getMonth() +1+ "/";
s += d.getDate() + "/";
s += d.getFullYear();
return s;
}
结果：今天日期是：7/21/2016
42.写出简单描述html标签（不带属性的开始标签和结束标签）的正则表达式，并将以下字符串中的html标签去除掉
var str = “
里面的段落
var reg = /<\/?\w+\/?>/gi;
var str = “
里面的段落
alert(str.replace(reg,”"));
43.截取字符串abcdefg的efg
alert('abcdefg'.substring(4));
44.简述创建函数的几种方式
第一种（函数声明）：
function sum1(num1,num2){
return num1+num2;
}
第二种（函数表达式）：
var sum2 = function(num1,num2){
return num1+num2;
}
第三种（函数对象方式）：
var sum3 = new Function("num1","num2","return num1+num2");
45.Javascript如何实现继承？
1.构造继承法
2.原型继承法
3.实例继承法
46.Javascript创建对象的几种方式？
1、var obj = {};（使用json创建对象）
如：obj.name = '张三';
obj.action = function ()
{
alert('吃饭');
};
2、var obj = new Object();（使用Object创建对象）
如：obj.name = '张三';
obj.action = function ()
{
alert('吃饭');
};
3、通过构造函数创建对象。
(1)、使用this关键字
如：var obj = function (){
this.name ='张三';
this.age = 19;
this.action = function ()
{
alert('吃饭');
};
}
(2)、使用prototype关键字
如：function obj (){}
obj.prototype.name ='张三';
obj.prototype.action=function ()
{
alert('吃饭');
};
4、使用内置对象创建对象。
如：var str = new String("实例初始化String");
var str1 = "直接赋值的String";
var func = new Function("x","alert(x)");//示例初始化func
var obj = new Object();//示例初始化一个Object
47.js延迟加载的方式有哪些？
1. defer和async
2. 动态创建DOM方式（创建script，插入到DOM中，加载完毕后callBack）
3. 按需异步载入js
48.哪些操作会造成内存泄漏？
内存泄漏指任何对象在您不再拥有或需要它之后仍然存在。
垃圾回收器定期扫描对象，并计算引用了每个对象的其他对象的数量。如果一个对象的 引用数量为 0（没有其他对象引用过该对象），或对该对象的惟一引用是循环的，那么 该对象的内存即可回收。
1. setTimeout 的第一个参数使用字符串而非函数的话，会引发内存泄漏。
2. 闭包
3. 控制台日志
4. 循环（在两个对象彼此引用且彼此保留时，就会产生一个循环）
49.判断一个字符串中出现次数最多的字符，统计这个次数
var str = 'asdfssaaasasasasaa';
var json = {};
for (var i = 0; i < str.length; i++) {
if(!json[str.charAt(i)]){
json[str.charAt(i)] = 1;
}else{
json[str.charAt(i)]++;
}
};
var iMax = 0;
var iIndex = '';
for(var i in json){
if(json[i]>iMax){
iMax = json[i];
iIndex = i;
}
}
alert('出现次数最多的是:'+iIndex+'出现'+iMax+'次');
50.写一个获取非行间样式的函数
function getStyle(obj,attr,value)
{
if(!value)
{
if(obj.currentStyle)
{
return obj.currentStyle(attr);
}
else{
obj.getComputedStyle(attr,false);
}
}
else
{
obj.style[attr] = value;
}
}
51.字符串反转，如将 '12345678' 变成 '87654321'
//思路：先将字符串转换为数组 split()，利用数组的反序函数 reverse()颠倒数组，再利 用 jion() 转换为字符串
var str = '12345678';
str = str.split('').reverse().join('');
52.将数字 12345678 转化成 RMB形式 如： 12,345,678
//思路：先将数字转为字符， str= str + '' ;
//利用反转函数，每三位字符加一个 ','最后一位不加； re()是自定义的反转函数，最后再反转回去！
function re(str) {
str += '';
return str.split("").reverse().join("");
}
function toRMB(num) {
var tmp='';
for (var i = 1; i <= re(num).length; i++) {
tmp += re(num)[i - 1];
if (i % 3 == 0 && i != re(num).length) {
tmp += ',';
}
}
return re(tmp);
}
53.生成5个不同的随机数；
//思路：5个不同的数，每生成一次就和前面的所有数字相比较，如果有相同的，则放 弃当前生成的数字！
var num1 = [];
for(var i = 0; i < 5; i++){
num1[i] = Math.floor(Math.random()*10) + 1; //范围是 [1, 10]
for(var j = 0; j < i; j++){
if(num1[i] == num1[j]){
i--;
}
}
}
54.去掉数组中重复的数字
方法一:
//思路：每遍历一次就和之前的所有做比较，不相等则放入新的数组中！
//这里用的原型 个人做法；
Array.prototype.unique = function(){
var len = this.length,
newArr = [],
flag = 1;
for(var i = 0; i < len; i++, flag = 1){
for(var j = 0; j < i; j++){
if(this[i] == this[j]){
flag = 0; //找到相同的数字后，不执行添加数据
}
}
flag ? newArr.push(this[i]) : '';
}
return newArr;
}
方法二：
var arr=[1,2,3,3,4,4,5,5,6,1,9,3,25,4];
Array.prototype.unique2 = function()
{
var n = []; //一个新的临时数组
for(var i = 0; i < this.length; i++) //遍历当前数组
{
//如果当前数组的第i已经保存进了临时数组，那么跳过，
//否则把当前项push到临时数组里面
if (n.indexOf(this[i]) == -1) n.push(this[i]);
}
return n;
}
var newArr2=arr.unique2(arr);
alert(newArr2); //输出1,2,3,4,5,6,9,25
55.阶乘函数；
//原型方法
Number.prototype.N = function(){
var re = 1;
for(var i = 1; i <= this; i++){
re *= i;
}
return re;
}
var num = 5;
alert(num.N());
56.window.location.search() 返回的是什么？
http://localhost:8080/xxx?ver=1.0&id=123
返回值：?ver=1.0&id=timlq 也就是问号后面的部分
57.window.location.reload() 作用？
刷新当前页面。
58.javascript 中的垃圾回收机制？
在Javascript中，如果一个对象不再被引用，那么这个对象就会被GC回收。如果两个对象互相引用，而不再 被第3者所引用，那么这两个互相引用的对象也会被回收。因为函数a被b引用，b又被a外的c引用，这就是为什么 函数a执行后不会被回收的原因。
59.精度问题: JS 精度不能精确到 0.1 所以 。。。。同时存在于值和差值中
var n = 0.3,m = 0.2, i = 0.2, j = 0.1;
alert((n - m) == (i - j)); //false
alert((n-m) == 0.1); //false
alert((i-j)==0.1); //true
60.计算字符串字节数：
new function(s){
if(!arguments.length||!s) return null;
if(""==s) return 0;
var l=0;
for(var i=0;i if(s.charCodeAt(i)>255) l+=2; else l+=1; //charCodeAt()得到的是unCode码 } //汉字的unCode码大于 255bit 就是两个字节 alert(l); }("hello world!"); var reg = /^[a-zA-Z_][a-zA-Z0-9_]{5,20}/, name1 = 'leipeng', name2 = '0leipeng', name3 = '你好leipeng', name4 = 'hi'; alert(reg.test(name1)); alert(reg.test(name2)); alert(reg.test(name3)); alert(reg.test(name4)); 1、标签之中直接添加 οnclick="fun()"; 2、JS添加 Eobj.onclick = method; 3、绑定事件 IE： obj.attachEvent('onclick', method)； FF: obj.addEventListener('click', method, false); 代码重用 避免全局变量（命名空间，封闭空间，模块化mvc..） 拆分函数避免函数过于臃肿 注释61.匹配输入的字符：第一个必须是字母或下划线开头，长度5-20
62.如何在HTML中添加事件，几种方法？
63.你如何优化自己的代码？
64.使用js实现这样的效果：在文本域里输入文字时，当按下enter键时不换行，而是替换成“{{enter}}”,(只需要考虑在行尾按下enter键的情况).
65.简述readonly与disabled的区别
ReadOnly和Disabled的作用是使用户不能够更改表单域中的内容.
但是二者还是有着一些区别的：
1、Readonly只针对input(text/password)和textarea有效，而disabled对于所有的表单 元素有效，包括select,radio,checkbox,button等。
2、在表单元素使用了disabled后，我们将表单以POST或者GET的方式提交的话，这 个元素的值不会被传递出去，而readonly会将该值传递出去
66.为什么扩展javascript内置对象不是好的做法？
因为你不知道哪一天浏览器或javascript本身就会实现这个方法，而且和你扩展的实现有不一致的表现。到时候你的javascript代码可能已经在无数个页面中执行了数年，而浏览器的实现导致所有使用扩展原型的代码都崩溃了。。。
67.什么是三元表达式？“三元”表示什么意思？
三元运算符:
三元如名字表示的三元运算符需要三个操作数。
语法是 条件 ? 结果1 : 结果2;. 这里你把条件写在问号(?)的前面后面跟着用冒号(:)分 隔的结果1和结果2。满足条件时结果1否则结果2。
68.变量的命名规范以及命名推荐
变量，函数，方法：小写开头，以后的每个单词首字母大写 （驼峰）
构造函数，class：每个单词大写开头
基于实际情况，以动词，名词，谓词来命名。尽量言简意骇，以命名代替注释
69.三种弹窗的单词以及三种弹窗的功能
1.alert
//弹出对话框并输出一段提示信息
function ale() {
//弹出一个对话框
alert("提示信息！");
}
2.confirm
//弹出一个询问框，有确定和取消按钮
function firm() {
//利用对话框返回的值 （true 或者 false）
if (confirm("你确定提交吗？")) {
alert("点击了确定");
}
else {
alert("点击了取消");
}
}
3.prompt
//弹出一个输入框，输入一段文字，可以提交
function prom() {
var name = prompt("请输入您的名字", ""); //将输入的内容赋给变量 name ，
//这里需要注意的是，prompt有两个参数，前面是提示的话，后面是当对话框出来后，在对话框里的默认值
if (name)//如果返回的有内容
{
alert("欢迎您：" + name)
}
}
70.主流浏览器内核
IE trident 火狐gecko 谷歌苹果webkit Opera：Presto
71.JavaScript的循环语句有哪些？
for,for..in,while,do...while
72.闭包：下面这个ul，如何点击每一列的时候alert其index？
- 这是第一条
- 这是第二条
- 这是第三条
//js
window.onload = function() {
var lis = document.getElementById('test').children;
for (var i = 0; i < lis.length; i++) {
lis[i].onclick = (function(i) {
return function() {
alert(i)
};
})(i);
};
}
73.列出3条以上ff和IE的脚本兼容问题
(1) window.event：
表示当前的事件对象，IE有这个对象，FF没有，FF通过给事件处理函数传递事件对象
(2) 获取事件源
IE用srcElement获取事件源，而FF用target获取事件源
(3) 添加，去除事件
IE：element.attachEvent(“onclick”, function) element.detachEvent(“onclick”, function)
FF：element.addEventListener(“click”, function, true) element.removeEventListener(“click”, function, true)
(4) 获取标签的自定义属性
IE：div1.value或div1[“value”]
FF：可用div1.getAttribute(“value”)
74.在Javascript中什么是伪数组？如何将伪数组转化为标准数组？
伪数组（类数组）：无法直接调用数组方法或期望length属性有什么特殊的行为，但仍可以对真正数组遍历方法来遍历它们。典型的是函数的argument参数，还有像调用getElementsByTagName,document.childNodes之类的,它们都返回NodeList对象都属于伪数组。可以使用Array.prototype.slice.call(fakeArray)将数组转化为真正的Array对象。
75.请写出一个程序，在页面加载完成后动态创建一个form表单，并在里面添加一个input对象并给它任意赋值后义post方式提交到：http://127.0.0.1/save.php
window.οnlοad=function(){
var form=document.createElement("form");
form.setAttribute("method", "post");
form.setAttribute("action", "http://127.0.0.1/save.php");
var input=document.createElement("input");
form.appendChild(input);
document.body.appendChild(form);
input.value="cxc";
form.submit();//提交表单
}
76.用JavaScript实现升序排序。数据为23、45、18、37、92、13、24
//升序算法
function sort(arr){
for (var i = 0; i for (var j = 0; j if(arr[j]>arr[j+1]){ var c=arr[j];//交换两个变量的位置 arr[j]=arr[j+1]; arr[j+1]=c; } }; }; return arr.toString(); } console.log(sort([23,45,18,37,92,13,24])); var User = { count = 1， getCount：function（）{ return this.count; } } console.log(User.getCount()); var func = User.getCount; console.log(func()); 1 undefined（因为是window对象执行了func函数）;
78.用程序实现找到html中id名相同的元素？
var nodes=document.querySelectorAll("#form1>*");
for(var i=0,len=nodes.length;i var attr=nodes[i].getAttribute("id"); var s=1; for(var j=i+1;j if(nodes[j].getAttribute("id")==attr){ s++; alert("id为："+attr+"的元素出现"+s+"次"); } } } window.error try{}catch(){}finally{} 第1题： function setName(){ name="张三"; } setName(); console.log(name); 答案："张三" 第2题： //考点：1、变量声明提升 2、变量搜索机制 var a=1; function test(){ console.log(a); var a=1; } test(); 答案：undefined 第3题： var b=2; function test2(){ window.b=3; console.log(b); } test2(); 答案：3 第4题： c=5;//声明一个全局变量c function test3(){ window.c=3; console.log(c); //答案：undefined，原因：由于此时的c是一个局部变量c，并且没有被赋值 var c; console.log(window.c);//答案：3，原因：这里的c就是一个全局变量c } test3(); 第5题： var arr = []; arr[0] = 'a'; arr[1] = 'b'; arr[10] = 'c'; alert(arr.length); //答案：11 console.log(arr[5]); //答案：undefined 第6题： var a=1; console.log(a++); //答案：1 console.log(++a); //答案：3 第7题： console.log(null==undefined); //答案：true console.log("1"==1); //答案：true，因为会将数字1先转换为字符串1 console.log("1"===1); //答案：false，因为数据类型不一致 第8题： typeof 1; "number" typeof "hello"; "string" typeof /[0-9]/; "object" typeof {}; "object" typeof null; "object" typeof undefined; "undefined" typeof [1,2,3]; "object" typeof function(){}; //"function" 第9题： parseInt(3.14); //3 parseFloat("3asdf"); //3 parseInt("1.23abc456"); parseInt(true);//"true" NaN 第10题： //考点：函数声明提前 function bar() { return foo; foo = 10; function foo() {} //var foo = 11; } alert(typeof bar());//"function" 第11题： //考点：函数声明提前 var foo = 1; function bar() { foo = 10; return; function foo() {} } bar(); alert(foo);//答案：1 第12题： console.log(a);//是一个函数 var a = 3; function a(){} console.log(a);////3 第13题： //考点：对arguments的操作 function foo(a) { arguments[0] = 2; alert(a);//答案：2，因为：a、arguments是对实参的访问，b、通过arguments[i]可以修改指定实参的值 } foo(1); 第14题： function foo(a) { alert(arguments.length);//答案：3，因为arguments是对实参的访问 } foo(1, 2, 3); 第15题 bar();//报错 var foo = function bar(name) { console.log("hello"+name); console.log(bar); }; //alert(typeof bar); foo("world");//"hello" console.log(bar);//undefined console.log(foo.toString()); bar();//报错 第16题： function test(){ console.log("test函数"); } setTimeout(function(){ console.log("定时器回调函数"); }, 0) test(); 结果： test函数 定时器回调函数 79.程序中捕获异常的方法？ js基础提及