vue面试题八：一 JS中Promise用法、二闭包的概念与用法、三对象创建的四种方式与区区别、四 如何声明一个类

一 JS中Promise用法

一 为什么会出现promise？

在没有出现promise前，会出现回调地狱。
什么是回调函数？
把这个参数传到另一个函数里面，也就是主函数里面，当主函数里面的事情干完再回头去执行当做参数传进去的回调函数，回头去调用，这就是回调的概念。

 fn1(callbackFn2){
		fn2(callbackFn3){
				fn3(callbackFn4){
				     fn4()
				 }
		}				
}

            // 二 简单的promise的例子：
			//let isSuccess = true;
			let isSuccess = false;
			// 2.1 new Promise((resolve,reject)=>{}) 成功与失败的时候调用
			let promiseDemo = new Promise((resolve,reject)=>{
			    if(isSuccess){
				   resolve("成功")
				}else{
				   reject("失败")
				}
			})
			// 2.2 写个函数执行里面的promise.
			// .then(success=>{},fail=>{})中有两个回调函数，成功的回调与失败的回调。
			// 当然程序报错执行   .catch()
			let testFn =  function(){
			  promiseDemo.then((success=>{
			     console.log(success)
			  }),(fail=>{
			     console.log(fail)
			  })).catch(error=>{
			    console.log(error)  
			  })
			}
			// 2.3 执行函数------执行函数里面的promise
			testFn();


            // 三 链式调用---------   .then()中 return 返回promise后，可接着使用下一个.then()， 即通过这样实现链式调用。
			let testFn2 =  function(){
			   promiseDemo.then((success=>{
			     console.log(success)
				 return Promise.resolve("返回一个Promise-----resolve")
			  }),(fail=>{
			     console.log(fail)
				 return Promise.reject("返回一个Promise-----reject")
			  })).then((success=>{
			     console.log(success)
			  }),(fail=>{
			     console.log(fail)
			  }))
			  .catch(error=>{
			    console.log(error)  
			  })
			}
			testFn2()

二 闭包的概念与用法

1 什么是闭包？ 方法里返回方法

          function closure(){
			  let a1 = 1;
			  return function(){
			      return a1
			  }
			}

2 那闭包存在到底有啥意义？
2.1 延长变量存在的生命周期。--------普通方法执行一遍，里面的变量就会没了，而闭包函数的变量是存内存里面的，不会执行一遍，变量就没了
2.2 创造私有的环境。---------- 因为变量是一直存内存的，所以多个闭包函数的实例是互不相干的。

            //例子1:计数器
			let makeCounter = function(){
			   // 1 闭包中的变量
			   let num = 0
			   // 2 闭包中的函数，用于改变闭包中的变量
			   function changBy(val){
			      num+=val
			   }
               // 3 闭包返回的方法
               return {
			     add:function(){
				   changBy(1)
				 },
				 reduce:function(){
				   changBy(-1)
				 },
				 value:function(){
				   return num
				 }
			   }			   
			}
			
			// 使用闭包
			let counter1 = makeCounter()    
			let counter2 = makeCounter()
			
			counter1.add()
			counter1.add()
			counter1.add()
			counter1.add()
			
			counter2.add()
			counter2.add()
			console.log(counter1.value())
			console.log(counter2.value())



            // 例子2：判断是否首次加载
            function isFirstLoad() {
				var _list = []; // 有_的变量说明是私有变量，函数内部使用的
					return function(id) {
						if (_list.indexOf(id) >=0) {
						// 也可用includes
							return false;
						} else {
							_list.push(id);
							return true;
						}
					}
			}
			// 使用
			let firstLoad = isFirstLoad();
			console.log(firstLoad(10)); // true
			console.log(firstLoad(10)); // false
			console.log(firstLoad(20)); // true

三 对象创建的四种方式与区区别

            // 1 通过 {} 创建
            let obj1 = {
				name: '张三',
				age: 10,
				say: function() {
						console.log("hello everybody")
				}
			}
			console.log(obj1)
			console.log(obj1.name)
			console.log(obj1.age)
			console.log(obj1.say())
			
			
			// 2 通过构造函数创建对象
			function Person() {
				this.name = '张三';
				this.age = 10;
				this.say = function () {
					console.log('hello everybody');
				}
			}
			Person.prototype.test = function(){
				console.log('test');
			};
			
            let obj2 = new Person();
			console.log(obj2.name);
			console.log(obj2.age);
			obj2.say();//'hello everybody'
			obj2.test();//'test'


            // 3 通过 Object.create() 创建
			let obj3 = Object.create(obj1);
			console.log(obj3)
			console.log(obj3.name)
			console.log(obj3.age)
			console.log(obj3.say())
			
			
			// 4 通过 new object() 创建
			var obj4 = new Object();
			obj4.name = "张三";
			obj4.age = 10;
			obj4.say = function () {
				console.log("hello everybody");
			}
            console.log(obj4)

方式一、二、三几乎没有区别。 方式四（使用Object.create）创建的对象，原对象的属性和方法都会挂到新对象的原型上。如下图

** 方式一、二、三 **

** 方式四 **

四 如何声明一个类

            // 1 通过构造函数声明(即可以new的函数)
			function Animal(type) {
				this.type = type
				this.walk = function () {
					console.log('I am walking')
				}
			}
			let dog = new Animal('dog')
			let monkey = new Animal('monkey')
			console.log(dog)
			console.log(monkey)
			
			// 2 通过class声明 （构造函数的语法糖）
			class Animal2 {
				constructor(type){
					this.type = type
				}
				walk () {
					console.log('I am walking')
				}
			}
			let tiger = new Animal('tiger')
			console.log(tiger)

五JS删除DOM元素的两种方法

// 删除子节点
var box=document.getElementById("box");
box.parentNode.removeChild(box);



// 删除自身
var box=document.getElementById("box");
box.remove();