55JS零碎知识2

一、函数节流和函数去抖

1、函数节流(throttle):就是当事件触发之后,按照一个固定时间间隔执行函数。

2、函数去抖(debounce):就是当事件触发之后,按照一个固定时间间隔执行函数。假若在等待的时间内,事件又触发了重新开始计时。

来源:https://www.cnblogs.com/chenjinxinlove/p/6093246.html

二、new Date()的运行结果(????)

1、在服务器端,参数和返回值均是格林尼治时间,比如nodejs下

2、在客户端,参数和返回值均是本地时间,比如html下

三、继承的几种方式

1、构造函数继承:

在子类构造函数内部,把父类构造函数的this换成子类的this,并且给子类实例增加属性。

2、原型链继承:

将父类的实例赋给子类的原型,并且给子类的原型增加属性。

3、实例继承:

在子类构造函数内部,new父类的实例并用变量接收,并给该变量增加属性,再返回该变量。

4、拷贝继承:

在子类构造函数内部,new父类的实例并遍历该实例的属性,复制到子类的原型上,再给该子类的原型增加属性。

5、组合继承:

构造函数继承+原型链继承

6、寄生组合继承:

构造函数继承+原型链继承(原型链所在的新构造函数为空)。

附1、Drag.prototype.\__proto\__=EventEmitter.prototype;//这是更安全的继承方法,一般在Node里都是采用这种方式实现继承。IE不支持

附2、Drag.prototype=new EventEmitter;//相对这种方式来说,上边的写法更安全

四、Promise的执行流程(箭头函数的this总是指向实例对象)

(1)定义一个函数,在这个函数里,首先给Promise类传进一个函数参数用来定义个性化的逻辑,这个函数参数传入两个函数参数作为成功的回调和失败的回调。

(2)定义的那个函数执行时,首先new出Promise类的实例,即Promise类里的代码执行。执行到Promise类的参数函数时遇上异步,于是用then为Promise类注册成功和失败的回调,然后继续执行异步,调用成功或失败的回调。

六、运行结果

```javascript:run

for(var i=0,j=0;i<10,j<6;i++,j++){

var k=j+i;

}

console.log(i,j,k);//6,6,10

for(let i=0,j=0;i<10,j<6;i++,j++){

let k=j+i;

}

console.log(i,j,k);//i is not defined

```

七、函数的创建方式

(1)函数声明: function sum1(n1,n2){ return n1+n2 };

(2)函数表达式:又叫函数字面量 var sum2=function(n1,n2){ return n1+n2; };

(3)函数构造法:参数必须加引号 var sum3=new Function('n1','n2','return n1+n2');console.log(sum3(2,3));//5

(4)自执行函数

八、函数的调用方式

(1)直接调用

(2)对象调用

(3)new调用

(4)call、apply调用

九、原生js事件

(1)DOM0事件模型:直接在dom对象上注册事件名称

(2)DOM2事件模型:通过addEventListener和removeEventListener注册事件

十、js 错误Error对象详解

来源:https://www.jb51.net/article/124210.htm

(1)概念

error,指程序中的非正常运行状态,在其他编程语言中称为“异常”或“错误”。解释器会为每个错误情形创建并抛出一个Error对象,其中包含错误的描述信息。ECMAScript定义了六种类型的错误。除此之外,还可以使用Error构造方法创建自定义的Error对象,并使用throw语句抛出该对象。

A、ReferenceError:引用错误,例如变量没定义,console.log(b) // Uncaught ReferenceError: b is not defined

B、TypeError:类型错误,例如用数字调用函数方法,123() // Uncaught TypeError: 123 is not a function

C、SyntaxError:语法错误,例如变量名首字符为数字,var 1a // Uncaught SyntaxError: Unexpected number

D、RangeError:使用内置对象的方法时,参数超范围,例如[].length = -5 // Uncaught RangeError: Invalid array length

E、URIError:URI错误,例如decodeURI("%") // Uncaught URIError: URI malformed at decodeURI

F、EvalError:错误的使用了Eval,在ES5以下的JavaScript中,当eval()函数没有被正确执行时,会抛出evalError错误。

(2)错误处理,即使程序发生错误,也保证不异常中断的机制。

```javascript

try{

可能发生错误的代码

}catch(err){

只有发生错误时才执行的代码

}finally{

无论是否出错,肯定都要执行的代码

}

```

使用try包裹的代码,即使不出错,效率也比不用try包裹的代码低;在try中,尽量少的包含可能出错的代码;无法提前预知错误类型的错误,必须用try catch捕获;finally可以省略;

(3)、抛出自定义错误

何时:函数的定义者需要告知函数的调用者此处出错,本函数内,剩下的代码不再执行;

如何:throw new Error("提示文字");

十一、js 如何实现sum(2,3)===sum(2)(3)

```javascript

function sum() {

var arguments0 = arguments[0];

if (arguments.length === 1) {

return function (arguments1) {

return arguments0 + arguments1;

}

}

if (arguments.length === 2) {

return arguments[0] + arguments[1]

}

}

console.log(sum(2,3)==sum(2)(3));

```

十二、普通函数与箭头函数对照

总:var 变量=(参数)=>函数体

1、普通函数:var f=function(){return 5}

箭头函数:var f=()=>5

2、普通函数:var f=function(v){return 5}

箭头函数:var f=(v)=>5

3、普通函数:map(function(){return 5})

箭头函数:map(()=>5)

4、普通函数:map(function(v){return 5})

箭头函数:map(v=>5)

十三、获取服务器端时间

```javascript

var xhr = new XMLHttpRequest;

xhr.open('head', 'temp.xml?_=' + Math.random());

xhr.onreadystatechange = function () {

if (xhr.status === 200) {

if (xhr.readyState === 2) {

var time = xhr.getResponseHeader('Date');

//获取到的时间默认是格林尼治时间(GMT),北京时间(GMT+0800)

console.log(new Date(time));//把获取的时间转换为北京时间

}

}

};

xhr.send(null);

```

十三、循环与定时器

```javascript

for(var i=0;i<3;i++){

setTimeout(function(){

console.log(i);

},100);

//3,3,3

setTimeout(function() {

for(var j = 0; j < 3; j++) {

console.log(j);

}

}, 100);

//0,1,2

```

十四、前端向后台发送请求有几种方式?

1、link标签的href属性

2、script标签的src属性

3、img标签的src属性

4、ajax发送请求

5、表单提交发送请求

6、a标签的href发送请求

7、iframe的src属性发送请求

十五、其它

1、事件参数

(1)<div onclick="myFunction(event,'event')"></div>

(2)<div ng-click="myFunction($event, myInput.value)"></div>

(3)abc.onclick=function(event){//这里的event是事件参数,一般情况下这里是没有参数的}

2、“=”

(1)数学中的“=”,是过程的最终结果,其前面是过程,后面是结果。

(2)编程中的“=”,是赋值,把其后的值赋值给前面的变量。

3、高阶函数,把函数作为参数或者返回值的函数。

4、问号传参:随机数防止缓存,后台不需要这个数;

十六、用div模拟<select>标签时,下拉框超出下方区域,浮于上方的实现代码

```javascript

var this_bottom_top = $(this).get(0).getBoundingClientRect().bottom;

var footer_top_top = $('#footer').get(0).getBoundingClientRect().top;

var height = $('#ul' + id).height();

if (footer_top_top - this_bottom_top < height) {

$('#ul' + id).css({ 'top': '', 'bottom': '24px' });

}

```

十六、什么是预解释?

在当前作用域下,在JS代码执行之前,浏览器会对带var和带function进行提前声明或定义;

十七、函数定义和执行阶段:

1、定义3阶段:

1)开辟一个空间地址

2)把函数体中的所有JS代码做为字符串存在这个空间中

3)把空间地址赋值给函数名

2、调用4阶段:

1)形成一个私有作用域

2)给形参赋值

3)预解释

4)代码从上到下的执行;

十八、CRUD:增查改删

1、增:create

2、删:delate

3、改:update

4、查:read

十九、User Agent中文名为用户代理,简称 UA,它是一个特殊字符串头,使得服务器能够识别客户使用的操作系统及版本、CPU 类型、浏览器及版本、浏览器渲染引擎、浏览器语言、浏览器插件等。

二十、鼠标点击菜单以外的地方 使下拉菜单消失

https://www.jianshu.com/p/a0c1f673efe7


 

猜你喜欢

转载自blog.csdn.net/bao13716164418/article/details/91798749