javascript - what is the meaning of this? setTimeOut(() => this.active=true, 0) - Stack Overflow

I am practicing angularjs2 and I notice this sentence but cannot understand what this means.@Component(

I am practicing angularjs2 and I notice this sentence but cannot understand what this means.

@Component({
    selector: 'hero-form',
    templateUrl: 'app/hero-formponent.html'
})

export class HeroFormComponent {

    model = new Hero(18, 'Dr IQ', this.powers[0], 'Chuck Overstreet');

    active = true;

    newHero() {
        this.model = new Hero(42, '', '');
        this.active = false;
        setTimeOut(()=> this.active=true, 0)*
    }

}

I know in JavaScript there is a function name setTimeOut but cannot understand the () and arrow =>...

Thanks in advance!

I am practicing angularjs2 and I notice this sentence but cannot understand what this means.

@Component({
    selector: 'hero-form',
    templateUrl: 'app/hero-form.ponent.html'
})

export class HeroFormComponent {

    model = new Hero(18, 'Dr IQ', this.powers[0], 'Chuck Overstreet');

    active = true;

    newHero() {
        this.model = new Hero(42, '', '');
        this.active = false;
        setTimeOut(()=> this.active=true, 0)*
    }

}

I know in JavaScript there is a function name setTimeOut but cannot understand the () and arrow =>...

Thanks in advance!

Share Improve this question edited Jun 5, 2016 at 6:01 Nayuki 18.6k6 gold badges58 silver badges84 bronze badges asked Jun 5, 2016 at 5:57 nextdoordocnextdoordoc 1,7676 gold badges21 silver badges30 bronze badges
Add a ment  | 

1 Answer 1

Reset to default 15

This is the new JavaScript arrow function notation. The line you quoted is almost equivalent to this piece of code in the traditional function notation:

setTimeout(function() {
    this.active = true;
}, 0);

However in the traditional notation, this will be bound to the global object (outside of strict mode - in strict mode, you will get a ReferenceError), due to how binding of this in execution contexts works. The traditional workaround before the introduction of arrow functions would be:

var self = this;
setTimeout(function() {
    self.active = true;
}, 0)

Arrow functions solve this problem by lexically binding this, just as any other variable, instead of defining their own. In addition to how this is treated, arrow functions do not implicitly define their own arguments or super variables either, but bind them lexically.


Digging deeper, what does newHero() do? It is a constructor function. When you call it, a new object is allocated, and it can be referred to within the function body by the variable this. The constructor sets two properties on the this object; these properties are .model and .active, being given specific values.

The expression (() => this.active = true) creates a function object. It describes what should execute at a later time. When the function object is called, the body gets executed. So the line of code creates the function object and gives it to setTimeout(), which will call the function object after the given length of time - in this case, 0 milliseconds.

发布者:admin,转转请注明出处:http://www.yc00.com/questions/1740815591a4257866.html

相关推荐

发表回复

评论列表(0条)

  • 暂无评论

联系我们

400-800-8888

在线咨询: QQ交谈

邮件:admin@example.com

工作时间:周一至周五,9:30-18:30,节假日休息

关注微信