测试一下你的Javascript基础能拿下多少分

非面试题,考察的都是js很基础的东西

l 填空题（第题1分）

Js数据类型：_______ 、_______ 、_______ 、_______ 、_______ 、______ 、_______。
ES6 新增数据类型______表示____________的值。
声明变量使用关键字______ 、______。
声明常量使用关键字______，常量在声明时必须______。
声明字符串类型的数据时，可以使用符号______ 、______ 、______ 。
模板字符串可以______行 , 如果要在模板字符串中引用变量使用______。
字符串表示真假值：______，数值表示真假值：______ 。
"+"符号在__________________作字符串拼接符使用。
typeof 关键字在检查数组与对象类型的数据时返回____________，检查函数时返回____________。
类型转换有两种分别是：______，______。将字符串强制转换为数字类型可以使用 ______、______ 、______ 。
写出的6个内置对象 ______、______、______ 、______ 、______ 、______ 。
数组中______从0开始计数，______从1开始计数，______属性表示数组的长度。
JSON.stringify() 的作用：____________, JSON.parse() 的作用是:____________。
正则表达式中元字符 \D表示匹配____________，\d表示匹配____________。
____________获取当前节点的父级节点，____________获取当前节点的祖先节点。
DOM中唯一操作cookie的属性是____________。
实现绑定事件的两个函数分别是：_________________、___________________。
element.offsetLeft 计算元素到__________，_________计算元素到顶部的距离。
事件冒泡是___________将事件层层传递，而___________是从外向内传递事件。普通事件只支持___________,捕获与冒泡不能______________。
删除cookie 可以将__________________。
克隆元素使用___________。接收一个布尔值的参数，如果为____________则该节点的所有后代节点也都会被克隆,如果为____________则只克隆该节点本身。
定时器有两种：_________、_________。定时器代码不会____________主线程。
面向对象三大特征：______、______、______。
ES6继承使用关键字_________，在子类构造方法中必须首先调用_______________，实例化子类会首先_______________。
____________返回 0 ~ 1 之间的随机数。
在数组与对象的数据操作中，数据 B 复制了数据 A 当修改数据 B 时不影响数据 A，叫作____________。
p.name 访问对象成员使用 [] 方括号语法可以写成_______________。
函数中 return 关键字的作用：_______________________________________。
表达式 200 + 2 * 0 - true 的结果是____________。
阻止事件冒泡可以使用_________、_________。

l 选择题（每题 1 分）

循环语句中___终止当前离它最近的循环，___结束本轮循环继续下一次循环。
A: breack
B: continue
C: catch
D: boolean
this指向: ______ 。
A: 在函数中，this 表示全局对象。
B: 在方法中，this 该方法所属的对象。
C: 如果单独使用表示全局对象。
D: 在事件中，this 表示接收事件的元素。
E: setTimeout时this 指向全局对象使用箭头函数时this可以指向程序的上下文，（就是定义时所在的对象，而不是使用时所在的对象）
修改this 指向可以使用以下函数：___ 。
A: func.call(thisArg, arg1, arg2, ...)
B: func.call(thisArg, [argsArray])
C: func.abbly(thisArg, [argsArray])
D: func.bind(thisArg[, arg1[, arg2[, ...]]])
以下数组操作描述错误的是 ___ 。
A：length属性表示数组的长度，从0开始计数。
B： “arr[arr.length] = 19;”，表示在数组的末尾处添加一相新的元素，数组长度不变。
C：for/in 可以迭代出数组的下标，for/of迭代数组的元素值。
D：“arr.sort()” 方法可以反转数组。
以下对象操作描述正确的是___。
A：对象可以任意添加属性和方法。
B：删除成功使用 ‘delete’ 关键字。
C： ‘in’ 关键字可以检查对象是否是某个类的实例。
D： instanceof 判断对象是否是某个类的实例，结果是boolean类型。
为字符串方法匹配正确的说明：‘search()’ ___、‘split()’___、‘replace() ’___、‘match()’___。
A：字符搜索
B：替换匹配到的字符串
C: 分割字符串操作
D: 匹配一个或多个规则
以下方法中可以获取到空白节点（文件节点）的方法是：___。
A: element.lastElementChild
B: element.previousElementSibling
C: element.childNodes
D: element.firstChild
对元素节点描述正确的是：___。
A：元素的节点类型为1。
B: 元素的节点类型为3。
C：‘element.nodeName’返回元素名称并且该名称为大写。
D：‘element.nodeType’属性可读写。
以下事件中支持事件冒泡的事件有：___。
A： onclick
B： onmouseenter
C: onmouseleave
D: onmouseout
阻止默认事件：___。
A： event.preventDefault()
B： IE使用 return false
C: event.stopPropagation()
D: IE使用 return true
下面关于箭头函数描述正确的有___：。
A：箭头函数中没有参数时参数可以省略。
B：箭头函数没有语句时{}花括号可以省略。
C：省略参数时不能省略花括号。
D：省略花括号时不能写retuan关键字。
表达式 5+'1'+1+1-1的结果是___。
A：数字5110
B：字符”5111”
C: 数字 7
D：字符串”5110”
表达式 -1 && 0 && 1 结果：___
A： 0
B: false
C: -1
D: true
关于Bom描述正确的有：___。
A： screen.back() 加载 history 列表中的前一个 URL
B： location.reload() 重新载入当前文档
C： window.class() 关闭当前窗口
D: BOM 中最顶层对象是 window 对象。
关于 class 描述错误的有：___。
A： class 是ES6定义类的新语法。
B： constructor 构造函数，在实例化时第一个被调用的函数，类成员要在 constructor 构造中定义。定义类时必须写constructor 否则报错。
C： class 中成员方法间不允许使用 , 逗号分隔。
D： static 修改静态属性和方法。
以下哪个不是 Promise 状态______。
A： pending
B: fulfilled
C: rejected
D: starting
选出可以表示 boolean 为假的选项：______。
A： undefined
B: null
C: ‘’
D: Symbol('My symbol')
关于 ... 描述正确的有：___。
A：在函数中使用表示rest 参数（形式为...变量名），用于获取函数的多余参数。rest 参数搭配的变量是一个数组，该变量将多余的参数放入数组中。
B： rest 参数可以替代 arguments 对象，并且在参数列表中只能有一个。
C： ... 可以在数组中使用，表示展开运算符。
D： Set、Map对象可以使用...展开运算符。
事件委托描述正确的有：___。
A：可以让后续添加的元素直接拥有事件的行为，也就是直接就拥有事件，而不需要再单独指定事件。
B：事件委托必须把事件注册给父级元素。
C：只有绑定事件才能支持事件委托。
D：通过event.target 可以分辨是哪个元素触发的事件。

简答题（每题10分）

什么是事件委托？

编写一个返回5-10随机数的函数。

筛选出字符串 "qq号大全，984033324，1452245123-22q2222ddddd，456123" 中QQ号。

编写函数实现数组去重。

为下面HTML 添加事件,当点击Ii 时可以在控制台输入li中内容

<ul id="mul">
 <li>苹果</li>
 <li>香蕉</li>
 <li>草莓</li>
 <li>樱桃</li>
</ul>

怎么将数组的浅拷贝改变为深拷贝，请举例说明

什么是命名空间？

简述局部变量、全局变量、作用域链。

怎么批量添加元素并且保证高效率？

什么是递归？

如果觉得不错记得点个赞,转载请注明出处,谢谢

揭晓答案

1.Number、String、Boolean、Object、undefiend、null、Symbol
2.Symbol、独一无二
3.Var、let
4.Let、确保常量的唯一
5.``(ES6的模板字符串)、 " "(双引号) 、' '(单引号)
分别在什么场景使用?单双引又有什么区别呢?
6.换、$
7.true/false、1/0
8.连接字符串
9.Object、 function
10.字符串、数值类型、.toString()、String()、隐式转换
参考 https://blog.csdn.net/qq_37777208/article/details/83586470

Array、Number、Object、function、String、Math
参考https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects
12.索引index(也就是下标)、计算时、 length
13.将数据转换成对象、将字符串串专成对象
14.匹配一个非数字字符。等价于 [^0-9]、匹配一个数字字符。等价于 [0-9]
15..parent、.parentNode
16.document.cookie
17.OnClick、addEvenlisten
18.浏览器页面的左边、element.offsetTop
19.最内层的元素、事件捕获、事件捕获
20.浏览器的缓存清除
21.cloneNode()、true、false
22.SetTimeout、setInterval
23.继承、多态、封装
24.Super、父类的构造方法、调用自身的构造方法
25.Math.random()
26.深拷贝
27.p[name]
28.终止该判断或终止该函数往下执行
29.199 (Number类型)
30 e.stopPropagation、e.preventDefault() (不考虑IE兼容)
选择题
1 A B
2 A E
3 A C D
4 A B
5 B D
6 A C B D
7 C
8 B D
9 A B
10 A B
11 A
12 A
13 A
14 B
15 C
16 D
17 A B
18 C D
19 D
简答题
1 利用事件冒泡，指定一个事件处理程序，就可以管理某一类型的所有事件。
事件委托的作用
(1).提高性能：每一个函数都会占用内存空间，只需添加一个时间处理程序代理所有事件，所占用的内存空间更少；
(2).动态监听：使用事件委托可以自动绑定动态添加的元素，即新增的节点不需要主动添加也可以具有和其它元素一样的事件。
2
 var Range = Max - Min;
 var Rand = Math.random();
 return Min + Math.round(Rand * Range);
}
console.log(GetRandomNum(5,10))
3
利用正则匹配 (可以写一个函数然后把定义好的值放进去)
let reg = /^[1-9][0-9]{4,9}$/
let obj = ["984033324","1452245123-22q2222ddddd","456123"]
for(let i=0;i<obj.length;i++){
    if(reg.test(obj[i]) == true){
        console.log('QQ号',obj[i]);
    }
}
4
数组去重 (总结了12种方法,如果有需要我再列举12种方法以及它们的优缺点)
(1)利用ES6 Set去重
function unique (arr) {
  return Array.from(new Set(arr))
}
var arr = [1,1,'true','true',true,true,15,15,false,false, undefined,undefined, 
            null,null, NaN, NaN,'NaN', 0, 0, 'a', 'a',{},{}];
console.log(unique(arr))
 //[1, "true", true, 15, false, undefined, null, NaN, "NaN", 0, "a", {}, {}]
(2) 利用for嵌套for，然后splice去重（ES5中最常用）
(3) 利用indexOf去重
(4) 利用sort()
(5) 利用对象的属性不能相同的特点进行去重
(6) 利用includes
(7) 利用hasOwnProperty
(8) 利用filter
(9) 利用Map数据结构去重
(10) 利用reduce+includes
(11) [...new Set(arr)]
(12) 利用递归去重
5
let ul = document.getElementById("mul")
ul.addEventListener("click", function(e){
   console.log(e.target.innerText);
});
6
(1) 利用JSON.parse JSON.stringify
(2)
function deepClone(obj) {
   // 如果传入的值不是一个对象，就不执行
   if (Object.prototype.toString.call(obj) !== '[object Object]') return
   // 根据传入值的类型初始化返回结果
   let result = obj instanceof Array ? [] : {}
   for (let key in obj) {
       if (obj.hasOwnProperty(key)) {
           // 如果obj是个对象，就递归调用deepClone去遍历obj的每一层属性，如果不是对象就直接返回值
           result[key] = Object.prototype.toString.call(obj[key]) === '[object Object]' ? deepClone(obj[key]) : >obj[key]
       }
   }
   return result
}
// 改进判断对象的方法
console.log(typeof null === 'object') // true
console.log(Object.prototype.toString.call(null) === '[object Object]') // false
7
http://dditblog.com/itshare_458.html
8
http://caibaojian.com/javscript-var.html
9
思路:循环+判断
获取到对应元素的id或者class,然后再加以元素控制
10
// function fn() {
//   fn()
// }
// 1. 自己调用自己
// 2. 因为自己调用自己会出现无限死循环 所以还需要设置一个停止条件
// 3. 递归永远是树形结构 -> 递归树
// 4. 最先调用的函数 最后执行完毕 最后调用的函数 最先执行完毕
// 阶乘
// 5! = 5 * 4 * 3 * 2 * 1  = fn(5) => fn(4) * 5
// 4! =     4 * 3 * 2 * 1  = fn(4) => fn(3) * 4
// 3! =         3 * 2 * 1  = fn(3) => fn(2) * 3
// 2! =             2 * 1  = fn(2) => fn(1) * 2
// 1! =                 1  = fn(1) => 1
// fn(n) = fn(n - 1) * n
// n! => fn(n)
// 5! => fn(5)  4! => fn(4)  3! => fn(3)  2! => fn(2)  1! => fn(1)

function fn(n) {
 if (n === 1) {
   return 1
 } else {
   return n * fn(n - 1)
 }
}

//fn(5) 开启一个栈内存
//fn(4) 开启一个栈内存
//fn(3) 开启一个栈内存
//fn(2) 开启一个栈内存 
//fn(1) 开启一个栈内存 return 1
console.log(fn(4))  //24
// console.log(fn(5))
// console.log(fn(6))

测试javascript基础能拿多少分

测试javascript基础能拿多少分

测试一下你的Javascript基础能拿下多少分

l 填空题（第题1分）

l 选择题（每题 1 分）

简答题（每题10分）

揭晓答案