JavaScript基础面试题

Posted 2020-12-10 xiewangfei123

1、 介绍javascript的基本数据类型
Number、String 、Boolean 、Null、Undefined
Object 是 JavaScript 中所有对象的父对象
数据封装类对象：Object、Array、Boolean、Number 和 String
其他对象：Function、Arguments、Math、Date、RegExp、Error
新类型：Symbol

2、 说说写JavaScript的基本规范？
1) 不要在同一行声明多个变量
2) 使用 ===或!==来比较true/false或者数值
3) switch必须带有default分支
4) 函数应该有返回值
5) for if else 必须使用大括号
6) 语句结束加分号
7) 命名要有意义，使用驼峰命名法

3、 jQuery使用建议
1) 尽量减少对dom元素的访问和操作
2) 尽量避免给dom元素绑定多个相同类型的事件处理函数，可以将多个相同类型事件
处理函数合并到一个处理函数，通过数据状态来处理分支
3) 尽量避免使用toggle事件

4、 Ajax使用
全称 ：Asynchronous Javascript And XML
所谓异步，就是向服务器发送请求的时候，我们不必等待结果，而是可以同时做其他的事情，等到有了结果它自己会根据设定进行后续操作，与此同时，页面是不会发生整页刷新的，提高了用户体验。
创建Ajax的过程：
1) 创建XMLHttpRequest对象（异步调用对象）

var xhr = new XMLHttpRequest();

2) 创建新的Http请求（方法、URL、是否异步）

xhr.open(‘get’,’example.php’,false);

3) 设置响应HTTP请求状态变化的函数。
onreadystatechange事件中readyState属性等于4。响应的HTTP状态为200(OK)或者304(Not Modified)。
4) 发送http请求

xhr.send(data);

5) 获取异步调用返回的数据
注意：
1) 页面初次加载时，尽量在web服务器一次性输出所有相关的数据，只在页面加载完成之后，用户进行操作时采用ajax进行交互。
2) 同步ajax在IE上会产生页面假死的问题。所以建议采用异步ajax。
3) 尽量减少ajax请求次数
4) ajax安全问题，对于敏感数据在服务器端处理，避免在客户端处理过滤。对于关键业务逻辑代码也必须放在服务器端处理。

5、 JavaScript有几种类型的值？你能画一下他们的内存图吗？
基本数据类型存储在栈中，引用数据类型（对象）存储在堆中，指针放在栈中。
两种类型的区别是：存储位置不同；原始数据类型直接存储在栈中的简单数据段，占据空间小、大小固定，属于被频繁使用数据，所以放入栈中存储；引用数据类型存储在堆中的对象,占据空间大、大小不固定,如果存储在栈中，将会影响程序运行的性能
引用数据类型在栈中存储了指针，该指针指向堆中该实体的起始地址。当解释器寻找引用值时，会首先检索其在栈中的地址，取得地址后从堆中获得实体。

6、 栈和堆的区别？
栈（stack）：由编译器自动分配释放，存放函数的参数值，局部变量等；
堆（heap）：一般由程序员分配释放，若程序员不释放，程序结束时可能由操作系统释放。

7、 Javascript实现继承的几种方式

JavaScript实现继承的3种方法

1）、借用构造函数法（又叫经典继承）

function SuperType(name) {
this.name = name;
this.sayName = function() { window.alert(this.name); };}function SubType(name, age) {
SuperType.call(this, name); //在这里借用了父类的构造函数
this.age = age;}

 

2）、对象冒充

function SuperType(name) {
this.name = name; this.sayName = function() { window.alert(this.name); };}function SubType(name, age) {
this.supertype = SuperType; //在这里使用了对象冒充 this.supertype(name);
this.age = age;}

 

3）、组合继承（最常用）

function SuperType(name) {
this.name = name;
}SuperType.prototype = { sayName : function() { window.alert(this.name); }};function SubType(name, age) { SuperType.call(this, name); //在这里继承属性 this.age = age;}
SubType.prototype = new SuperType(); //这里继承方法

 

8 、Javascript创建对象的几种方式？

JavaScript定义类的4种方法

1）、工厂方法

function creatPerson(name, age) { var obj = new Object();
obj.name = name; obj.age = age;
obj.sayName = function() { window.alert(this.name); }; return obj;}

 

2）、构造函数方法

function Person(name, age) {
this.name = name; this.age = age;
this.sayName = function() { window.alert(this.name); };}

 

3）、原型方法

function Person() {}Person.prototype = { constructor : Person, name : "Ning", age : "23", sayName : function() { window.alert(this.name); }};

 

大家可以看到这种方法有缺陷，类里属性的值都是在原型里给定的。

4）、组合使用构造函数和原型方法（使用最广）

function Person(name, age) { this.name = name; this.age = age;}Person.prototype = { constructor : Person, sayName : function() { window.alert(this.name); }};

 

将构造函数方法和原型方法结合使用是目前最常用的定义类的方法。这种方法的好处是实现了属性定义和方法定义的分离。比如我可以创建两个对象person1和person2，它们分别传入各自的name值和age值，但sayName()方法可以同时使用原型里定义的。

9、Javascript作用链域
作用域链的原理和原型链很类似，如果这个变量在自己的作用域中没有，那么它会寻找父级的，直到最顶层。
注意：JS没有块级作用域，若要形成块级作用域，可通过（function（）｛｝）（）；立即执行的形式实现。

10、 谈谈this的理解
1) this总是指向函数的直接调用者（而非间接调用者）
2) 如果有new关键字，this指向new出来的那个对象
3) 在事件中，this指向目标元素，特殊的是IE的attachEvent中的this总是指向全局对象window。