容易遗忘的Javascript点

Posted 2020-11-27 七分sunshine!

 

1.关于 JavaScript中的 Array.prototype.slice.call( )

function test(){
  var _args=Array.prototype.slice.call(arguments);
 console.log(args);
}

test(1,3);   //[1,3]  

此函数可以将 类数组(此处为arguments)转换为真正的数组， 这个方法可以类数组转换成真正数组

。 前提是此对象有length属性。（IE下 Dom节点集合不可转）

 

1） 先来说一个有趣的分享。

var a_arr=[1,2,3];

a_arr.get=function(){return 0};

由于 a_arr是一个附带get方法的一个数组。大家不用觉得奇怪，数组是对象，这么加个get方法没有毛病。Array.prototype.slice.call（a_arr）     //    ==>> [1,2,3]  输出变成这样。

说明slice过程会仅仅保留数组部分，不会保留其他杂项。 于是上述灰色代码部分的例子就可以理解了。

 

2)  关于call的理解。-----------------------------  停止线 -----------------------

var data=[{name:"liuhf",age:19},{name:"wangwu",age:21}]

function print_name(){
  console.log(this.name)
}

print_name.call(data[0])   // liuhf

for(var i=0;i<data.length;i++){
  
  (function(i){
       console.log(i)
       this.eat=function(){console.log("I can eat, my index is"+i)}
		this.eat();
  }).call(data[i],i)   //把遍历对象绑定到eat方法，call的第二个参数是把参数带到被调函数
  
}

javascript中，一切皆对象，函数也是对象。 那么函数也有方法，比如 apply()和call() . 他们是函数的原型对象上的，所以任何函数都可以调用。

 

 

 2. 关于对象转化数组，类数组转化为数组的一些操作总结。

let array_like_obj = {
 \'0\': \'a\',
 \'1\': \'b\',
 \'2\': \'c\',
 length: 3
};

real_arr=Array.from(arrayLike)   //  ==>> ["a", "b", "c"]

/*---------------------------------------------------------------*/

let array_like_arr = [1,2,3] ;

array_like_arr.get=function(){ return 0 }  

Array.from(array_like_arr)  // [1,2,3]

// 或者

Array.prototype.slice.call(array_like_arr) // [1,2,3]

 

2.拓展预算符 ...   (如果是数组，就相当于去 [ ] 括号，如果是字符串，那么就变成数组 ，每项 )

var a =[{d:1}]//去掉外套就是 {d:1}
var b = {...a,e:2}

var a=[1,2]
var b =[...a]
//b (2) [1, 2]

var a=[1,2]
var b = [8,...a,9]
//b (4) [8, 1, 2, 9]

var s = \'nice\'
var a = [...s]
//a (4) ["n", "i", "c", "e"]

function a ([m,...n]){console.log(m,n)}
a([1])
//打印出 1  [ ]

扩展运算符内部调用的是数据结构的 Iterator 接口，因此只要具有 Iterator 接口的对象，都可以使用扩展运算符，比如 Map 结构。

 

3.函数调用和方法调用的区别：

{

 函数调用，   fn();

 

 方法调用，   obj.fn();

 

 构造函数调用， new Object() 或 new Object

  function Persion(age){

     this.name="liuhf";

     this.age=age;

  }

  var lhf=new Persion(27);      //{ age:27 ,name:"lhf"}

 

 间接调用

}

 

 在像这样的方法调用表达式里，对象O成

为调用上下文，函数体可以使用关键字this引用该对象。下面是一个具体的例子：

var calculator={ //对象直接量
 operand1：1,
 operand2:1，
 add：function(){
 //注意this关键字的用法，this指代当前对象
 this.result-this.operand1 + this.operand2;
 )
};
calculator.add()；//这个方法调用计算1+1的结果
calculator.result // => 2

大多数方法调用使用点符号来访问属性，使用方括号（的属性访问表达式）也可以进
属性访问操作。

 

4.实参对象：arguments（非严格模式下才有实用性）

arguments是一个类数组，指代函数实参，是个数组形式。有length属性。

arguments下有两个属性：callee （标准，代表当前执行的函数）,caller （非标准） 

判断函数定义和函数调用的参数是否个数相等：  arguments.length  arguments.callee.length

 

5.什么是闭包： 满足两个条件，嵌套函数，内部引用。