试题1
1. 写出JavaScript输出信息的5种方法；
（1） console.log("要输出的内容") 浏览器的控制台输出
（2） document.write("要输出的内容") 在直接在页面中展示输出的内容；
（3）alert("要输出的内容") 在浏览器中弹出一个对话框，然后把要输的内容展示出来； alert都是要把输出的内容首先转化为字符串再输出；
（4）prompt() ：用户输入框
（5）confirm()：用户选择框
2. 写出变量的命名规范规则？什么是驼峰命名法？举个例子声明变量 如：飞机子弹的速度。
- 第一个字符可以是字母，下划线或美元符号 $ 构成；
-
后续的字符可以使字母、数字、下划线或美元符号
-
变量名称区分大小写
-
保留字、关键字、JavaScript预定义了很多全局变量和函数不能用作自定义变量名和函数名
- 约定俗称：标识符要见名知意；
驼峰式命名法：又叫小驼峰式命名法。一般用来命名变量，用来解释描述变量
例如：var planeBulletSpeed; //飞机子弹的速度
3. 变量的数据类型有哪些？ 分别举例子。
JavaScript 语言的每一个值，都属于某一种数据类型。JavaScript 的数据类型，共有六种。（ES6 又新增了第七种 Symbol 类型的值）
- 数值（number）：整数和小数（比如
1和3.14） - 字符串（string）：文本（比如
Hello World）。 - 布尔值（boolean）：表示真伪的两个特殊值，即
true（真）和false（假） undefined：表示“未定义”或不存在，即由于目前没有定义，所以此处暂时没有任何值null：表示空值，即此处的值为空。- 对象（object）：各种值组成的集合。
通常，数值、字符串、布尔值这三种类型，合称为原始类型（primitive type）的值，即它们是最基本的数据类型，不能再细分了。对象则称为合成类型（complex type）的值，因为一个对象往往是多个原始类型的值的合成，可以看作是一个存放各种值的容器。至于undefined和null，一般将它们看成两个特殊值。
对象是最复杂的数据类型，又可以分成三个子类型。
- 狭义的对象（object）
- 数组（array）
- 函数（function）
狭义的对象和数组是两种不同的数据组合方式，除非特别声明，本教程的“对象”都特指狭义的对象。函数其实是处理数据的方法，JavaScript 把它当成一种数据类型，可以赋值给变量，这为编程带来了很大的灵活性，也为 JavaScript 的“函数式编程”奠定了基础。
4. 使用选择排序法从小到大排序 一个数组
拿出第一个数与后边的数进行比较，选出一个最小的，然后拿第二个数与后边的数进行比较...
var arr=[12,65,45,78,89,5,21,78,65];
for(var n=0;n<arr.length;n++){
for(var j=n+1;j<arr.length;j++){
if (arr[n]>arr[j]) {
var t=arr[n];
arr[n]=arr[j];
arr[j]=t;
}
}
}
console.log(arr)复制代码var array=[12,65,45,78,89,5,21,78,65];
function selectSort(arr){
for(var i=0;i<arr.length;i++){
var min=arr[i];
var minIndex=i;
for(var j=i+1;j<arr.length;j++){
if(min>arr[j]){
min=arr[j];
minIndex=j;
}
}
arr.splice(i,0,min);
arr.splice(minIndex+1,1)
}
}
selectSort(array)
console.log(array)复制代码5. 通过递归计算 10 的阶乘，写出代码。
function Factorial(n) {
if (n==1) {
return 1;
}
return n*Factorial(n-1);
}
console.log(Factorial(10))复制代码6. 将下面的数组去重，写出代码，var arr = [55,25,"name",68,"hellow",33,95,46,"a",68,20,"name",68,55,75,"a"]
var arr = [55,25,"name",68,"hellow",33,95,46,"a",68,20,"name",68,55,75,"a"];
var newArr=[];
for(var n=0;n<arr.length;n++){
if (newArr.indexOf(arr[n])==-1) {
newArr.push(arr[n]);
}
}
console.log(newArr)复制代码7. Cookie 是什么？ 如何读取？ 如何存储？
cookie是当你浏览某个网站的时候，由web服务器存储在你的机器硬盘上的一个小的文本文件。它其中记录了你的用户名、密码、浏览的网页、停留的时间等等信息。当你再次来到这个网站时，web服务器会先看看有没有它上次留下来的cookie。如果有的话，会读取cookie中的内容，来判断使用者，并送出相应的网页内容，比如在页面显示欢迎你的标语，或者让你不用输入ID、密码就直接登录等等。
当客户端要发送http请求时，浏览器会先检查下是否有对应的cookie。有的话，则自动地添加在request header中的cookie字段。注意，每一次的http请求时，如果有cookie，浏览器都会自动带上cookie发送给服务端。那么把什么数据放到cookie中就很重要了，因为很多数据并不是每次请求都需要发给服务端，毕竟会增加网络开销，浪费带宽。所以对于那设置“每次请求都要携带的信息（最典型的就是身份认证信息）”就特别适合放在cookie中，其他类型的数据就不适合了。
简单的说就是：
(1) cookie是以小的文本文件形式（即纯文本），完全存在于客户端；cookie保存了登录的凭证，有了它，只需要在下次请求时带着cookie发送，就不必再重新输入用户名、密码等重新登录了。
(2) 是设计用来在服务端和客户端进行信息传递的；
8*. 请描述一下 cookies，sessionStorage 和 localStorage 的区别？
cookie是网站为了标示用户身份而储存在用户本地终端（Client Side）上的数据（通常经过加密）。cookie数据始终在同源的http请求中携带（即使不需要），即会在浏览器和服务器间来回传递。
sessionStorage和localStorage不会自动把数据发给服务器，仅在本地保存。
存储大小：
cookie数据大小不能超过4k。 sessionStorage和localStorage 虽然也有存储大小的限制，但比cookie大得多，可以达到5M或更大。
有效期不同：
localStorage 存储持久数据，浏览器关闭后数据不丢失除非主动删除数据；
sessionStorage 数据在当前浏览器窗口关闭后自动删除。
cookie 设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭
9*. Var 、Let 和 const 的区别 。
var 声明的变量会挂载在window上，而 let 和 const 声明的变量不会；
var 声明变量存在变量提升，let 和 const 不存在变量提升
let 和 const 声明形成块作用域 同一作用域下let和const不能声明同名变量，而var可以 ；
Const ：
1）一旦声明必须赋值,不能使用 null 占位。
2）声明后不能再修改
3）如果声明的是复合类型数据，可以修改其属性
10. json 字符串转换集 json 对象、 json 对象转换 json 字符串。
//字符串转对象
JSON.parse(json)
eval('(' + jsonstr + '))
// 对象转字符串
JSON.stringify(json)复制代码11. 写出程序运行的结果？
for(i=0,j=0;i<10,j<6;i++,j++){
k= i+j;
}
console.log(k)//10复制代码
12. 如何阻止冒泡？如何阻止默认事件？
阻止冒泡 :
（1）给子级 event.propagation( )，
（2）return false
阻止默认事件 : event.preventDefault( )
相关文章：浅谈事件冒泡和事件捕获
13. 如何实现以下函数？console.log(add(2)(5));
function add(x,y){
var sum=x;
if(y){
return sum + y;
}else{
var add2=function(z){
return sum + z;
}
return add2;
}
}
var add1=add(2,3)
console.log(add1);
var add2=add(2)(3);
console.log(add2)复制代码14. 什么是闭包？ 写出优点和缺点？
（1）概念： 闭包是指有权访问另一个函数作用域的变量的函数。--《javascript高级程序设计》
简单理解成：定义在一个函数内部的函数
function f1() {
var n = 999;
function f2() {
console.log(n);
}
return f2;
}
var result = f1();
result(); // 999复制代码 上面代码中，函数f1的返回值就是函数f2，由于f2可以读取f1的内部变量，所以就可以在 外部获得f1的内部变量了。
闭包就是函数f2，即能够读取其他函数内部变量的函数。由于在 JavaScript 语言中，只有函数内部的子函数才能读取内部变量，因此可以把闭包简单理解成“定义在一个函数内部的函数”。闭包最大的特点，就是它可以“记住”诞生的环境，比如f2记住了它诞生的环境f1，所以从f2可以得到f1的内部变量。在本质上，闭包就是将函数内部和函数外部连接起来的一座桥梁。
（2） 特性：
- 函数嵌套函数；
- 函数内部可以引用函数外部的参数和变量；
- 函数变量和参数不会被垃圾回收机制回收；
（3）优缺点：
优点 ：- 希望一个变量长期驻扎在内存中
- 避免全局变量的污染
- 私有成员的存在
（4）自执行函数的好处
- 隔离作用域，避免全局作用域污染
- 模拟块级作用域
15. 判断下面函数是不是闭包，有什么问题吗？
function a(){
var m=3;
function b(){
console.log(m);
};
function c(){
console.log('string');
};
return b;
}
var result=a();
result();复制代码它是一个闭包，但是闭包是b而不是c，因为只是返回了b。
16. 描述一下原型链
1.原型： 每个函数都会默认有一个prototype属性，它是一个指针，指向此函数的原型对象。而构造函数作为一个函数，同样拥有自己的原型对象，而通过构造函数生成的对象实例中，拥有一个_proto_ 属性，它指向构造函数的原型对象，我们把构造函数的原型对象称为对象实例的原型。 如图：person就是构造函数，而Person prototype原型对象，也是对象实例person1的原型，此实例会继承所有存在它原型中的所有属性及方法。
原型链
既然每个实例对象都有一个原型，而每个构造函数也都能创建实例，那假如我们将构造函数 f1 的原型属性指向构造函数f2的实例对象，那么构造函数f1的实例对象就能访问f2的原型属性，依次类推，我们还可以把构造函数f3的原型属性指向f2的队实例对象，那么f3的实例对象同样可以访问到f1的原型，这样，就构成了一条原型链。
如图：从上到下依次讲解，首先，原型链的顶端是Object prototype ,它的_proto_ 属性为 ,接下来看构造函数SuperType ,它的prototype属性指向的是原型对象SuperType prototype ,这个原型对象其实是Object的一个实例对象，因为它的_proto_ 属性指向Object prototype ,因此，SuperType 的实例属性可以访问Object prototype 中的属性与方法。
同理，我们通过SubType.prototype=new SuperType(),可以将subType的原型对象指向为SuperType的一个实例对象，这样SubType 的实例对象instance通过原型链可以访问到上面三个原型中的合法属性与方法。
17. 什么是面向对象？（自己的理解）
“面向对象”是专指在程序设计中采用封装、继承、多态等设计方法，面向对象也是一种对现实世界理解和抽象的方法
18. 什么是构造函数？ 与普通的函数有什么区别？（写出自己的理解）
构造函数：是一种特殊的方法、主要用来创建对象时初始化对象，总与 new 运算符一起使用，创建对象的语句中构造函数的函数名必须与类名完全相同。
区别：构造函数首字母一般大写，普通函数则不需要。构造函数使用需要配合new操作符，普通函数则不需要。
19. setTimeout() 和 setInterval() 之间的区别？ 如何使用 setTimeout() 实现 setInterval() 的功能；
setInterval (函数，时间) 是 无限定时器，作用每隔一段时间后，自动调用该函数，无限次调用；clearinterval(t) 让函数停止；
setTimeout (函数，时间) 是 延时定时器，间隔一定时间调用一次，且只调用一次；clearTimeout(t) 让函数停止；
如果想用延时定时器实现无限次调用，必须在指定的函数内部重新启动一次延时定时器；
两种实现无限次调用的区别：
1. 如果函数的 执行时间 大于 无限定时器setInterval 的调用时间，会造成函数的累积；
2. setTimeout()写在函数的最后，不会造成函数的累积；
20. 谈谈对 this 对象的理解？（自己的理解）
在一般函数方法中使用，this 指代全局对象；
apply 调用 ，apply 方法作用是改变函数的调用对象，此方法的第一个参数为改变后调用这个函数的对象，this 指代第一个参数；
更多内容请查看我的相关文章：你真的理解 this 吗
21. new 操作符具体干什么呢？ （写出自己的理解）
创建一个空对象，并且this 变量引用该对象，同时还继承了该函数的原型。
属性和方法被加入到 this 引用的对象中。
22. 浏览器的内核分别是什么？
IE浏览器内核：Trident内核，也是俗称的IE内核；
Chrome浏览器内核：统称为Chromium内核或Chrome内核，以前是Webkit内核，现在是 Blink内核；
Firefox浏览器内核：Gecko内核，俗称Firefox内核；
Safari浏览器内核：Webkit内核；
Opera浏览器内核：最初是自己的 Presto 内核，后来是 Webkit ，现在是 Blink内核；
前五个属于主流浏览器。
一些国内的浏览器他们的内核：
搜狗浏览器：兼容模式（IE：Trident）和高速模式（webkit）
傲游浏览器：兼容模式（IE：Trident）和高速模式（webkit）
QQ浏览器：普通模式（IE：Trident）和极速模式（webkit）
360极速浏览器：基于谷歌（Chromium）和IE内核 360安全
23. 怎样添加、移除、复制创建和查找节点？
1）创建新节点
createDocumentFragment() //创建一个DOM片段
createElement() //创建一个具体的元素
createTextNode() //创建一个文本节点复制代码2）添加、移除、替换、插入
appendChild() //添加
removeChild() //移除
replaceChild() //替换
insertBefore() //插入
cloneChild()//克隆复制代码3）查找
getElementsByTagName() //通过标签名称
getElementsByName() //通过元素的Name属性的值
getElementById() //通过元素Id，唯一性复制代码24. 写出 String 、Array，3-5个常用的方法。
Array：
push() 末尾添加 ，返回新数组的长度，
.pop() 末尾删除，返回被删除的元素
.splice() 删除指定的元素，两个参数时，第一个参数是发生变化的位置，第二个参数是向后删除元素的个数（不包括自身）；三个参数时，第三个参数是要添加的元素；返回被删除的元素
.contact() 将两个或者多个数组合并，返回合并后的数组；
.indexOf() 和 .lastIndexOf() 检测指定元素是否在数组中，在的话，返回该元素的位置，不在的话，返回-1
.sort() 数组排序
.reverse()数组倒置
.join(参数) 是通过指定的字符，将数组变成字符串，返回出来，默认参数是逗号
.map(function(currentValue,index,arr), thisValue)，.map()方法返回一个新的数组，
.slice() 方法可从已有的数组中返回选定的元素。
string
.charAt(位置) 获取字符串中的某个字符
.substr(m,n) 截取一段字符
.split("") 通过字符串中指定的字符，将其分割成数组
arr.toUpperCase() 将字符串转化成全部转化为大写
arr.toLowerCase() 将字符串转化为小写
.replace("m","n"),替换指定的字符串(应用：敏感字符的替换)
25. 构造函数：银行账户
属性：账户名 存储金额
方法的 set 可以更新存储金额 和 get 访问当余额
26. 什么是 继承？ 请写出一个 Dog 构造函数，继承 Animal, 初始化 name =小黑，color =yellow， age = 3，并调用 Animal 的原形方法eat。
27. 什么是 ajax？ ajax 作用是什么？原生 js ajax 请求有几个步骤？分别是什么 ?
//创建 XMLHttpRequest 对象
var ajax = new XMLHttpRequest();//规定请求的类型、URL 以及是否异步处理请求。
ajax.open('GET',url,true);//发送信息至服务器时内容编码类型
ajax.setRequestHeader("Content-type", "application/x-www-form-urlencoded"); //发送请求
ajax.send(null); //接受服务器响应数据
ajax.onreadystatechange = function () {
if (obj.readyState == 4 && (obj.status == 200 || obj.status == 304)) {
}
};复制代码ajax几种请求方式？他们的优缺点？
get 数据是在 url 上，post 把提交的数据放置在是HTTP包的body体中.
post 请求的安全性要比 get 请求高
get 是获取数据，post 是提交数据
get 传送数据只有1k，post 理论没有限制
28. 去除字符串前后的空格符 var str=' aaa '
let str = " a abc abcd abcde ";
let result = str.replace(/(^\s)|(\s$)/g , "");
//a abc abcd abcde复制代码let str=" a abc abcd abcde ";
let arr=str.split('');
arr.pop();
arr.shift();
arr.join('');//a abc abcd abcde复制代码去除全部的空格
var str=" a abc abcd abcde ";var arr=str.split("");
var arr1=[]
for(var n=0;n<arr.length;n++){
if(arr[n]!=" "){
arr1.push(arr[n])
}
}
console.log(arr1.join(""))复制代码29. 用正则表达式写出 “以字母开头、后面可以是字母数字下划线，长 6-10”
30. 写出三本 你学习过程中看的书籍或者三个网站；
31. $(function() {} ) 与 window.load 的区别；
执行时机：window.onload 必须等待网页中所有的内容加载完毕后（包括图片）才能执行，$(document).ready(function()) 网页中所有DOM结构绘制完毕后就执行，可能DOM元素关联的元素并没有加载完；
编写个数：window.onload 不能同时编写多个；$(document).ready(function())能同时编写多个；
32. 请解释一下 *{box-sizing:border-box;}的作用，并且说明使用它有什么好处？
33. 实现距离 2019 年 3月 15 日还有 XX 天 XX 时 XX 分 XX 秒；
34. HTML5 本地存储的两种方式，分别有什么不同？ 如何存储和读取数据？
35. 解释 js 中为什么 0.1+0. 2 !=0.3
点击查看文章 浮点数计算精度问题（如0.1+0.2 !=0.3）
36. 解释事件冒泡机制。
点击查看文章 浅谈事件冒泡和事件捕获
37. 封装一个函数，可以通过传参的方式 row col 生成对应的表格。
<!DOCTYPE html><html lang="en"><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title> <
style>
td{
width: 100px;
height: 30px;
border: 1px solid #dddddd;
background-color: skyblue;
}
</style>
</head>
<body>
<input type="text" placeholder="请输入行数" id="rows"><br>
<input type="text" placeholder="请输入列数" id="cols"><br>
<button id="bt1">生成表格</button><br>
<table border="0" cellspacing="0"> </table>
<script>
window.onload=function(){
var table=document.getElementsByTagName("table")[0];
var bt1=document.getElementById("bt1");
bt1.onclick=function(){
var rows=document.getElementById("rows").value;
var cols=document.getElementById("cols").value;
function tables(rows,cols){
for(var n=0;n<rows;n++){
var tr=document.createElement("tr");
for(var j=0;j<cols;j++){
var td=document.createElement("td");
tr.appendChild(td);
}
table.appendChild(tr);
}
}
tables(rows,cols)
}
}
</script>
</body>
</html>复制代码38. 创建一个对象，给对象添加一个只接受数字类型的 sum 方法，计算参数的和并放回这个值。
function add(x,y){
var sum=x;
if(y){
return sum + y;
}else{
var add2=function(z){
return sum + z;
}
return add2;
}
}
var add1=add(2,3)
console.log(add1);
var add2=add(2)(3);
console.log(add2)复制代码39. 输出程序运行的结果
var x=prompt("请输入1-5的数字！","");
switch(x){
case "1" :alert("one");
case "2" :alert("two");
case "3" :alert("three");
case "4" :alert("four");
case "5" :alert("five");
default:alert("none");
}复制代码运行以上程序，在提示框中输入“4”，一次弹出的对话框将输出：four five none
输出结果：
function f(y) {
var x=y*y;
return x;
}
for(x=0;x<5;x++){
y=f(x);
document.write(y);//014916
}复制代码输出结果：
var a=0;
test();
function test(){
var a = 6;
b();
}
function b(){
alert(a);//0
}复制代码输出结果：
var a=5;
var x=10;
var y=15;
var k=50;
var n=10;
function myFunc(a,b){
var s = a+b;
return s;
}
function fun1(a,b){
var s=a*b;
return s;
}
function fun2(num){
k-=2;
var s=k+num;
return s;
}
function fun3(n){
n--;
return n;
}
function fun4(){
var x=5;
return x;
x=10;
}
function fun5(){
var hi=60;
return;
}
function fun6(){
return;
}
function fun7(){
var s=9+10;
}
function fun8(){
var a=50;
x=a;
return x+a;
}
console.log(myFunc(6,7));//13
console.log(fun1(a,x));//50
console.log(fun2(y));//63
console.log(fun2(y));//61
console.log(k);//46
console.log(fun3(n));//9
console.log(fun3(n));//9
console.log(fun3(n));//9
console.log(fun4());//5
console.log(fun5());//undefined
console.log(fun6(25));//undefined
console.log(fun7());//undefined
console.log(fun8());//100复制代码输出结果 :
var a=6;
var b=3;
var c="false";
console.log(a>b&&c&&!false||false); //false
console.log(a+b>=9&&c&&!false||c===false);//true复制代码输出结果 ：
var a=5;
var b=6;
var c="false";
if(c){
console.log(a);//5
if (a=7) {
console.log("hellow");//"hellow"
console.log(b=1);//1
if (b<6) {
console.log(a);//7
}
if (a>b) {
console.log("world")//"world"
}
}else{
console.log(b)
}
}复制代码输出结果：
function() A(){
}
function B(a){
this.a=a;
}
function C(){
if (a) {
this.a=a;
}
}
A.prototype.a = 1;
B.prototype.a = 1;
C.prototype.a = 1;
console.log(new A().a);
console.log(new B().a);
console.log(new C().a);复制代码
扫一扫
6234
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
