容易出错的前端题

1.js有几种数据类型,其中基本数据类型有哪些
五种基本类型: Undefined、Null、Boolean、Number和String。
引用类型: Object、Array和Function。

2.px和em的区别
px表示像素 ),是绝对单位,不会因为其他元素的尺寸变化而变化;
em表示相对于父元素的字体大小。em是相对单位 ,没有一个固定的度量值,而是由其他元素尺寸来决定的相对值。

3.JS哪些操作会造成内存泄露

(1)意外的全局变量引起的内存泄露。
function leak(){  
  leak="xxx";//leak成为一个全局变量,不会被回收  
}
(2)闭包引起的内存泄露。
(3)没有清理的DOM元素引用。
(4)被遗忘的定时器或者回调 ,子元素存在引起的内存泄露。

4.怎样添加、移除、移动、复制、创建和查找节点?

(1)创建新节点
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点
(2)添加、移除、替换、插入
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
(3)查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id,唯一性

5. javascript的typeof返回哪些数据类型.

string,boolean,number,undefined,function,object

6. 例举3种强制类型转换和2种隐式类型转换?

强制(parseInt,parseFloat,number)
隐式(== ===)

7. split() join() 的区别

前者是将字符串切割成数组的形式,后者是将数组转换成字符串

 8.new操作符具体干了什么呢?

1、创建一个空对象,并且 this 变量引用该对象,同时还继承了该函数的原型。

2、属性和方法被加入到 this 引用的对象中。

3、新创建的对象由 this 所引用,并且最后隐式的返回 this 。

9. javascript是面向对象的,怎么体现javascript的继承关系?

使用prototype原型来实现。

10 .form中的input可以设置为readonly和disable,请问2者有什么区别?

readonly不可编辑,但可以选择和复制;值可以传递到后台
disabled不能编辑,不能复制,不能选择;值不可以传递到后台

11写出3个使用this的典型应用

事件: 如onclick this->发生事件的对象
构造函数 this->new 出来的object
call/apply 改变this

12.什么是未声明和未定义的变量?

未声明的变量是程序中不存在且未声明的变量。如果程序尝试读取未声明变量的值,则会遇到运行时错误。未定义的变量是在程序中声明但尚未给出任何值的变量。如果程序尝试读取未定义变量的值,则返回未定义的值。

13.编写一个方法去掉数组里面重复的内容?(还可以用对象,这是比较常见的去重)

var arr = ['abc','abcd','sss','2','d','t','2','ss','f','22','d'];
//定义一个新的数组
var s = [];
//遍历数组
for(var i = 0;i<arr.length;i++){
    if(s.indexOf(arr[i]) == -1){  //判断在s数组中是否存在,不存在则push到s数组中
        s.push(arr[i]);
    }
}
console.log(s);
//输出结果:["abc", "abcd", "sss", "2", "d", "t", "ss", "f", "22"]
14.什么是闭包,如何使用它,为什么要使用它?

闭包就是能够读取其他函数内部变量的函数。由于在Javascript语言中,只有函数内部的子函数才能读取局部变量,因此可以把闭包简单理解成“定义在一个函数内部的函数”。
所以,在本质上,闭包就是将函数内部和函数外部连接起来的一座桥梁。闭包可以用在许多地方。它的最大用处有两个,一个是前面提到的可以读取函数内部的变量,另一个就是让这些变量的值始终保持在内存中。
使用闭包的注意点:
· 由于闭包会使得函数中的变量都被保存在内存中,内存消耗很大,所以不能滥用闭包,否则会造成网页的性能问题,在IE中可能导致内存泄露。解决方法是,在退出函数之前,将不使用的局部变量全部删除。
· 闭包会在父函数外部,改变父函数内部变量的值。所以,如果你把父函数当作对象(object)使用,把闭包当作它的公用方法(Public Method),把内部变量当作它的私有属性(private value),这时一定要小心,不要随便改变父函数内部变量的值

15.数组的去重几种写法:
1.

这个方法的思路是,将两个数组拼接为一个数组,然后使用 ES6 中的 Array.filter() 遍历数组,并结合 indexOf 来排除重复项

function distinct(a, b) {
    let arr = a.concat(b);
    return arr.filter((item, index)=> {
        return arr.indexOf(item) === index
    })
}
2.

双重 for 循环

最容易理解的方法,外层循环遍历元素,内层循环检查是否重复

当有重复值的时候,可以使用 push(),也可以使用 splice()

function distinct(a, b) {
    let arr = a.concat(b);
    for (let i=0, len=arr.length; i<len; i++) {
        for (let j=i+1; j<len; j++) {
            if (arr[i] == arr[j]) {
                arr.splice(j, 1);
                // splice 会改变数组长度,所以要将数组长度 len 和下标 j 减一
                len--;
                j--;
            }
        }
    }
    return arr
}
3.
for...of + includes()

双重for循环的升级版,外层用 for...of 语句替换 for 循环,把内层循环改为 includes()

先创建一个空数组,当 includes() 返回 false 的时候,就将该元素 push 到空数组中 

类似的,还可以用 indexOf() 来替代 includes()

function distinct(a, b) {
    let arr = a.concat(b)
    let result = []
    for (let i of arr) {
        !result.includes(i) && result.push(i)
    }
    return result
}
4.

Array.sort()

首先使用 sort() 将数组进行排序

然后比较相邻元素是否相等,从而排除重复项

function distinct(a, b) {
    let arr = a.concat(b)
    arr = arr.sort()
    let result = [arr[0]]

    for (let i=1, len=arr.length; i<len; i++) {
        arr[i] !== arr[i-1] && result.push(arr[i])
    }
    return result
}
5.

new Set()

ES6 新增了 Set 这一数据结构,类似于数组,但 Set 的成员具有唯一性

基于这一特性,就非常适合用来做数组去重了

function distinct(a, b) {
    return Array.from(new Set([...a, ...b]))
}

16. 如今有一个ul,里面有十亿个li,要求点击li触发事件,弹出对应li的内容

现在我们不可能再用for循环写了

<ul>
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
<li>5</li>
<li>6</li>
<li>7</li>
<li>8</li>
<li>9</li>
<li>10</li>
</ul>

function fun(){
var lilast = document.getElementsByTagName("li");
for(var i = 0; i < lilast.length; i ++){
(function(j){
lilast[j].onclick = function(){
console.log(lilast[j].innerHTML);
}
}(i));

}
}
fun();

我这里就写了10个



posted @ 2019-08-24 11:24  笑等茶凉zl  阅读(185)  评论(0编辑  收藏  举报