js相关的补充问题

1.undefined和null的区别

1.含义不同
  undefined:表示使用var声明变量但未对其加以初始化时,这个变量的值就是undefined
  null:是一个空对象指针,表示准备用来保存对象,还没有真正保存对象的值,
  如果定义的变量准备在将来用于保存对象,应该将该变量初始化为null2.类型不同
  未初始化定义的值用typeof检测出来是"undefined"(字符串),
  而null值用typeof检测出来是"object"(字符串)

2.简述同步和异步的区别

同步:
    同步的思想是:所有的操作都做完,才返回给用户。这样用户在线等待的时间太长,给用户一种卡死了的感觉(就是系统迁移中,点击了迁移,界面就不动了,但是程序还在执行,卡死了的感觉)。这种情况下,用户不能关闭界面,如果关闭了,即迁移程序就中断了。
异步:
    将用户请求放入消息队列,并反馈给用户,系统迁移程序已经启动,你可以关闭浏览器了。然后程序再慢慢地去写入数据库去。这就是异步。但是用户没有卡死的感觉,会告诉你,你的请求系统已经响应了。你可以关闭界面了。
同步和异步本身是相对的
	同步就相当于是 当客户端发送请求给服务端,在等待服务端响应的请求时,客户端不做其他的事情。当服务端做完了才返回到客户端。这样的话客户端需要一直等待。用户使用起来会有不友好。
	异步就是,当客户端发送给服务端请求时,在等待服务端响应的时候,客户端可以做其他的事情,这样节约了时间,提高了效率。
	存在就有其道理 异步虽然好 但是有些问题是要用同步用来解决,比如有些东西我们需要的是拿到返回的数据再进行操作的,这些是异步所无法解决的。

3.怎么添加、移除、复制、创建、和查找节点

1.创建节点:createElement()---创建元素节点
		  createTextNode()---创建文本节点
		  createDocumentFragment()---创建DOM片段
2.添加节点:appendChild()---追加节点
		  removeChild()---移除节点
		  replaceChild()---替换节点
		  insertBefore()---插入节点
3.查找节点:getElementById,getElementsByName,getElemenetsByTagName

4.实现一个函数clone 可以对Javascript中的五种主要数据类型(Number、string、Object、Array、Boolean)进行复制

方法一:
object.prototype.clone=function(){
    
    
    var o=this.constructor===Array?[]:{
    
    };
    for(var e in this){
    
    
        o[e]=typeof this[e]==="object"?this[e].clone():this[e]
    }
    return o
}
方法二:
function clone(obj){
    
    
    var o;
    switch(typeof obj){
    
    
        case 'undefined':break;
        case 'string':o=obj+'';break;
        case 'number':o=obj-0;break;
        case 'boolean':o=obj;break;
        case 'object':
            if(obj==null){
    
    
                o=null
            }else{
    
    
                if(object.prototype.toString.call(obj),slice(8,-1)==="Array"){
    
    
                    o=[];
                    for(var i=0;i<obj.length;i++){
    
    
                        o.push(clone(obj[i]))
                    }
                }else{
    
    
                    o=[];
                    for(var k in obj){
    
    
                        o[k]=clone(obj[k])
                    }
                }
            }
            break;
        default:o=obj;break;
    }
    return o;
}

5.如何消除一个数组里面重复的元素

var data=[1,2,3,4,1,2]
function noRepeat(arr){
    
    
    var newArr=[];
    for(var i=0;i<arr.length;i++){
    
    
        if(newArr.indexOf(arr[i])==-1){
    
    
            newArr.push(arr[i])
        }
    }
    return newArr
}
noRepeat(data)

6.Js的事件委托是什么,原理是什么

比方说a元素里面包含了b元素(或者说a元素是b元素的父元素),当b元素触发事件时,会同时把事件冒泡给a元素,也就是说a元素也会触发事件。利用这个原理,b元素就可以不对事件做任何处理,而是委托给a元素去处理,这样,当a元素中动态添加了多个与b元素同级的元素(也就是a新添加了几个儿子)或者是b元素的子元素(也就是a的孙子),这些新添加的元素都不用再绑定事件处理函数了,通通由a元素去处理即可(a元素通过target对象就可以知道事件委托方是哪个元素,从而进行不同的处理),这样就简化了程序,也避免了相互之间发生冲突的可能性。这就是事件委托。

7.如何改变函数内部的this指针的指向

每个函数都包含两个非继承来的方法call()和apply();
使用bind(),call()或者apply(),可以改变this的指向;
假设要改变fn函数内部的this的指向,指向obj,那么可以fn.call(obj);fn.bind(obj)或者fn.apply(obj);

8.列举几种解决跨域问题的方式,且说明原理

https://segmentfault.com/a/1190000011145364

跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。
1、 通过jsonp跨域				2、 document.domain + iframe跨域
3、 location.hash + iframe		4、 window.name + iframe跨域
5、 postMessage跨域			  6、 跨域资源共享(CORS7、 nginx代理跨域				8、 nodejs中间件代理跨域
9、 WebSocket协议跨域

9. 写一个返回闭包的函数

1.闭包函数是指有权访问另一个函数作用域中的变量的函数
2.创建闭包函数最常见的方式是在一个函数内创建另一个函数,通过另一个函数访问这个函数的局部变量
3.闭包的特点:1)函数嵌套函数;2)函数内部可以引用外部的参数和变量;3)参数和变量不会被垃圾回收机制回收;
4.闭包的优点:1)希望一个变量长期驻扎在内存中;2)避免全局变量的污染;3)私有变量存在
5.闭包的实现:1)函数嵌套函数;2)外层函数返回内层函数; 3)外面有一全局变量接受外层函数
function fun1() {
    
    
        var sum=0;
        function fun2() {
    
    
            sum++;
            return sum
        }
        return fun2
    }
var s=fun1();
console.log(s());

10.谈垃圾回收机制的方式及内存管理

JavaScript的内存管理机制是:内存基元在变量(对象,字符串等等)创建时分配,然后在他们不再被使用时“自动”释放。后者被称为垃圾回收。
垃圾回收机制有两种基本方式:
1.标记清除;2.引用计数

11.js实现继承的方法有哪些

1.原型链继承--将构造函数的原型设置为另一个构造函数的实例对象,这样就可以继承另一个原型对象的所有属性和方法,可以继续往上,最终形成原型链
2.构造函数继承--为了解决原型中包含引用类型值的问题,开始使用借用构造函数,也叫伪造对象或经典继承
3.组合继承--叫伪经典继承,将原型链和借用构造函数的技术组合到一块,使用原型链实现对原型属性和方法的继承,而通过构造函数来实现对实例属性的继承。
4.寄生式--其实就是在原型式继承得到对象的基础上,在内部再以某种方式来增强对象,然后返回。
5.寄生组合继承--组合继承是JS中最常用的继承模式,但其实它也有不足,组合继承无论什么情况下都会调用两次超类型的构造函数,并且创建的每个实例中都要屏蔽超类型对象的所有实例属性。
寄生组合式继承就解决了上述问题,被认为是最理想的继承范式。

12.判断一个变量是否是数组,有哪些办法

1instanceof
    function isArray (obj) {
    
    
      return obj instanceof Array;
    }
2、Array对象的isArray方法
	function isArray (obj) {
    
    
  		return Array.isArray(obj);
	}
3、Object.prototype.toString
    function isArray (obj) {
    
    
      return Object.prototype.toString.call(obj) === '[object Array]';
    }

13.let、const和var的区别

1.let/const定义的变量不会出现变量提升,而var定义的变量会提升
2.相同作用域中,letconst不能出现重复声明。而var就可以
3.const声明变量时必须设置初始值
4.const声明一个只读的常量,这个常量不可改变。
在这里有个非常重要的点:JS中,复杂数据类型,存储在栈中的是堆内存的地址,存在栈中的这个地址是不变的,但是存在堆中的值是可以变得。

14.箭头函数和普通函数有什么区别?

1、普通函数中的this总是指向调用它的那个对象,箭头函数没有自己的this,他的this永远指向其定义环境,任何方法都改变不了其指向,如call()、bind()、apply()。(正是因为它没有this,所以也就不能用作构造函数,也没有原型对象)
2、箭头函数不能当作构造函数,也就是说,不能使用new命令,否则会报错。
3、箭头函数不能使用yield命令,因此箭头函数不能用作genertor函数。
4、箭头函数没有原型属性。
5、箭头函数不能使用argumen对象,该对象在函数体内不存在。如果要用,可以用rest参数代替。
6、变量提升:由于js的内存机制,function的级别最高,而用箭头函数定义函数的时候,需要var(letconst)关键字,而var所定义的变量不能得到变量提升。故箭头函数一定要定义于调用之前。

this的指向问题:
    1、普通函数中,this指向其函数的直接调用者;
    2、箭头函数中,this指向其定义环境,任何方法都改变不了其指向,如call()、bind()等;
    3、构造函数中,如果不使用new,this指向window,如果使用new创建了一个实例,则this指向该实例。
    4、window内置函数中,如setInterval,setTimeout等,其内部的this指向Window。
	5、匿名函数的this指向Window。
	6、apply()、call()、bind()可以改变this的指向

15.HTTP的集中请求方法用途

get方法:发送一个请求来取得服务器上的某一资源
post方法:向URL指定的资源提交数据或附加新的数据
put方法:跟put方法很像,也是服务器提交数据,但是put指定了资源在服务器上的位置,post没有
head方法:只请求页面的首部
delete方法:删除服务器上的某资源
option方法:用于获取URL所支持的方法
trace方法:被用于激发一个远程的,应用层的请求消息回路
connect方法:把请求连接转换到透明的TCP/IP通道

16.如何进行网站性能优化?

content方面:减少HTTP请求,减少DNS查询,减少DOM元素数量
cookie方面:减少cookie的大小
css方面:将样式表放到页面顶部,不使用css表达式,不用@import<link>
js方面:将脚本放到页面底部,将js和css是用外部引用,压缩js和css,删除不需要的脚本,减少dom访问
图片方面:优化图片,优化css精灵

17.HTTP状态码及其含义

1.(1XX 信息状态码)100 continue---继续
2.(2xx 成功状态码)200 OK--正常返回信息,
				201  Created--请求成功并且服务器创建了新的资源
				202  Accepted--服务器已接受请求,但尚未处理
3.(3XX 重定向)301  请求的网页已永久的移动到新的位置
			304  自从上次请求后,请求的网页未修改过
4.(4XX 客户端错误)400  服务端无法理解请求的格式,客户端不应该再次使用相同的内容发出请求
				401	 请求未授权
				402  禁止访问
5.(5XX 服务器错误)500  最常见的服务器端错误

18.对浏览器内核的理解

分为渲染引擎和JS引擎
渲染引擎---负责取得网页的内容,整理讯息,以及计算网页的显示方式
JS引擎---解析和执行javascript来实现网页的动态效果

19.WEB标准以及W3C标准是什么?

标签闭合,标签小写,不乱嵌套,使用外部连接css和js,结构行为表现的分离

20.Doctype作用?

<!Doctype>是在文档的最前面,处于<html>标签之前,他告诉浏览器的解析器,用什么文档类型规范来解析这个文档。

21.canvas和svg有什么区别?

svg绘制出来的每一个图形的元素都是独立的dom节点,能够方便绑定事件,canvas输出的是一整幅画布,svg输出的是矢量图形,后期可以修改大小,canvas输出标量图像,放大会失真

22.浏览器的内核分别是什么?

IE:trident内核
Firefox:gecko内核
safari:wekit内核
opera:Blink内核
chrome:BLink内核,基于webkit

23.渐进增强和优雅降级的不同?

渐进增强:针对低版本进行构建页面,保证最基本的功能,再针对高级浏览器进行效果,交互和追加的功能达到更好的用户体验
优雅降级:一开始就构建完整的功能,然后再针对低版本浏览器进行兼容

24.什么是BFC?BFC创建的条件是啥?作用是什么?

BFC(块级格式化上下文)---有特殊功能的一个容器
条件:1.根元素;
	 2.浮动不为none的时候;
	 3.position为ablosute或者fixed;
	 4.display为inline-block/table-cell/flex/table-caption/inline-flex
	 5.overflow不为visible
特征:bfc区域的元素参与高度计算,bfc区域幻想不会重叠,上下摆放,bfc里面区域的元素不会受外界元素的影响

25.闭包

闭包就是能够读取其它函数内部变量的函数,函数嵌套函数,内部函数可以引用外部函数的参数和变量参数和变量不会被垃圾回收机制回收
优点:避免全局变量的污染
缺点:闭包会常驻内存,会造成内存泄露
注意点:

猜你喜欢

转载自blog.csdn.net/weixin_43689726/article/details/126223140