资讯专栏INFORMATION COLUMN

JavaScript函数内部属性

zhunjiee / 2804人阅读

摘要:函数内部属性函数内部有两个特殊对象,其中是一个类数组对象,包含着传入函数中的所有参数,主要用来保存函数参数。方法创建一个新的函数,调用时设置关键字为提供的值。

JavaScript函数内部属性

函数内部有两个特殊对象,this、arguments,其中arguments是一个类数组对象,包含着传入函数中的所有参数,主要用来保存函数参数。arguments对象还有一个callee属性,callee是一个指针,指向拥有这个arguments对象的函数。

callee

</>复制代码

  1. function fact(num){
  2. if(num<=1){
  3. return 1;
  4. }else{
  5. return num*fact(num-1);
  6. }
  7. }

这是一个实现阶乘的函数,采用递归的方式,这种方式存在一个问题就是,当fact的名称更改以后,如果不及时更改函数内部的函数名称,该函数则无效。此时采用callee属性替代当前拥有num参数对象的函数也就是fact.

采用callee实现如下

</>复制代码

  1. function fact(num){
  2. if(num<=1){
  3. return 1;
  4. }else{
  5. return num*arguments.callee(num-1);
  6. }
  7. }
this

</>复制代码

  1. this引用的是函数执行的环境对象,当函数被当做某个对象的方法调用时,此时的this对象引用的是当前调用函数的对象。

不同的环境this指向的值不同,下面是几种this在不同执行环境下所指向的值

方法调用

当函数作为对象方法的时候,函数里的this被绑定到当前对象上(也可以称之为方法调用)

例如:

</>复制代码

  1. var myNum = {
  2. value:1,
  3. increment:function(arg){
  4. this.value +=arg;
  5. }
  6. };
  7. myNum.increment(3);
  8. console.log("example1:"+myNum.value);//example1:4

上述的increment是一个对象方法,该对象方法内部的this指向的就是当前对象

函数调用

当函数作为非对象方法时候,this绑定到全局对象window,如果此时要调用内部函数可以采用that = this。

</>复制代码

  1. // 一般的函数
  2. function add(a){
  3. return a+2 ;
  4. }
  5. var value = 2;
  6. myNum.count = function (){
  7. let value = 1;
  8. let help = function(){
  9. this.value = add(this.value);
  10. }
  11. help();
  12. console.log(this.value);//4
  13. }
  14. myNum.count();
  15. that = this方式
  16. var value = 2;
  17. myNum.count = function (){
  18. let value = 1;
  19. let that = this;
  20. let help = function(){
  21. that.value = add(that.value);
  22. }
  23. help();
  24. console.log(that.value);//3
  25. }
  26. myNum.count();
构造函数

用new运算符调用构造函数,会先创建一个连接到构造函数的prototype(原型对象),再将this绑定到该对象

function Person(name){

</>复制代码

  1. this.name = name;
  2. }
  3. Person.prototype.sayName = function(){
  4. return this.name;
  5. }
  6. var person1 = new Person("TOM");
  7. console.log(person1.sayName());
applycallind

绑定this到指定的环境对象

</>复制代码

  1. var people = {
  2. name:"LILY"
  3. }
  4. console.log(Person.prototype.sayName.apply(people));
  5. console.log(Person.prototype.sayName.bind(people)());
  6. console.log(Person.prototype.sayName.call(people));

call :方法调用一个具有给定this值的函数,以及提供的参数列表。
apply: 方法调用一个具有给定this值的函数,以及提供的参数(数组或类数组对象)。
bind :方法创建一个新的函数,调用时设置this关键字为提供的“值”。

ES6 箭头函数

es6箭头函数里的this指向定义时所在的对象,不是执行的环境对象,就说明this在箭头函数里使用时是一个不变的值

</>复制代码

  1. function foo(){
  2. setTimeout(()=>{
  3. console.log("name:",this.name);
  4. },1000)
  5. }
  6. var name = "kiki";
  7. foo.call({name:"didi"});//name:didi
  8. 箭头函数里this的值指向的是定义时所在的环境对象,es5中实现箭头函数的方法:采用 that = this这种机制,实现this的绑定
  9. 以上是对函数的内部属性的理解。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/102588.html

相关文章

  • JavaScript难点笔记

    摘要:是班的学生构造函数的就是由这个构造函数得到的对象的原型对象父类对象构造函数的对象就是实例化对象和的原型对象。由于的所有对象都是构造函数只有除外。 前言 由于工作需求重新回顾了一下JavaScript,以下内容是我以前的学习笔记和其他参考资料整理完善后的内容,都是常用到的,使用频率比较高的,自己必须得精通的知识点的总结,便以后再复习参考。 第一章 JavaScript原型对象与原型链 1...

    APICloud 评论0 收藏0
  • JavaScript难点笔记

    摘要:是班的学生构造函数的就是由这个构造函数得到的对象的原型对象父类对象构造函数的对象就是实例化对象和的原型对象。由于的所有对象都是构造函数只有除外。 前言 由于工作需求重新回顾了一下JavaScript,以下内容是我以前的学习笔记和其他参考资料整理完善后的内容,都是常用到的,使用频率比较高的,自己必须得精通的知识点的总结,便以后再复习参考。 第一章 JavaScript原型对象与原型链 1...

    WrBug 评论0 收藏0
  • JavaScript难点笔记

    摘要:是班的学生构造函数的就是由这个构造函数得到的对象的原型对象父类对象构造函数的对象就是实例化对象和的原型对象。由于的所有对象都是构造函数只有除外。 前言 由于工作需求重新回顾了一下JavaScript,以下内容是我以前的学习笔记和其他参考资料整理完善后的内容,都是常用到的,使用频率比较高的,自己必须得精通的知识点的总结,便以后再复习参考。 第一章 JavaScript原型对象与原型链 1...

    Alfred 评论0 收藏0
  • 不为人知的javascript内部属性

    摘要:词法阶段会定义函数所用到的变量,加入到内部属性当中,它是一个数组,最后一位永远都是全局对象,向前依次是祖先父级。这个等同于的非标准但许多浏览器实现的属性。 内部属性在我们了解对象原型及环境变量时都有遇到过,可是毕竟看不到摸不着,很难更加深入的了解它的工作流程和作用,最近在chrome当中查看对象结构时,看到了释放出来的一些内部属性,这些以前大概都是概念,那么既然能看到,就让我们来探索一...

    plokmju88 评论0 收藏0
  • 这一次,我们换种姿势学习 javascript

    摘要:操作符或调用函数时传入参数的操作都会导致关联作用域的赋值操作。此外可以使用和来设置对象及其属性的不可变性级别。忽视这一点会导致许多问题。使用调用函数时会把新对象的属性关联到其他对象。 前言 《你不知道的 javascript》是一个前端学习必读的系列,让不求甚解的JavaScript开发者迎难而上,深入语言内部,弄清楚JavaScript每一个零部件的用途。本书介绍了该系列的两个主题:...

    zone 评论0 收藏0
  • 我所认识的JavaScript作用域链和原型链

    摘要:为了防止之后自己又开始模糊,所以自己来总结一下中关于作用域链和原型链的知识,并将二者相比较看待进一步加深理解。因此我们发现当多个作用域相互嵌套的时候,就形成了作用域链。原型链原型说完了作用域链,我们来讲讲原型链。   毕业也整整一年了,看着很多学弟都毕业了,忽然心中颇有感慨,时间一去不复还呀。记得从去年这个时候接触到JavaScript,从一开始就很喜欢这门语言,当时迷迷糊糊看完了《J...

    Bmob 评论0 收藏0

发表评论

0条评论

zhunjiee

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<