【第22期】观点:IT 行业加班,到底有没有价值?

JavaScript closure: compare with Java

原创 2016年08月31日 04:57:54

Resume

Closure in JavaScript provides us an opportunity to make our codes clearer and Object Oriented. Actually I consider that closure is an implementation of class in JavaScript. We will compare with Java in this passage.


Simple inheritance in Java

In Java, we can easily write 2 class like

//Product.class
class Product{
    protected String name;
    protected int price;
    public Product(String name, int price){
        this.name = name;
        this.price = price;
        if (price < 0) {
            throw new RangeError('Cannot create product ' + this.name + ' with a negative price'); //RangeError is not defined, because it's not important in this case.
        }
    }
}
//Food.class
class Food extends Product{
    protected String category = "food";
    public Food(String name, int price){
        super(name, price);
    }
}

Food inherits Product and initiates Product with 2 arguments: name and price.
It’s quite simple so that we will not explain it.
Let’s see what should we do in JavaScript.


JavaScript

function Product(name, price) {
    this.name = name;
    this.price = price;
    if (price < 0) {
        throw RangeError('Cannot create product ' + this.name + ' with a negative price');
    }
}

function Food(name, price) {
    Product.call(this, name, price);
    this.category = 'food';
}

console.log((new Food('Cake', 5)).price);

The most import thing here is function.call(this argument, argument, argument, ...).
When we run these codes, it will print 5 which is exactly the price of cheese.
But why?
When we instantiate Food, then we jump into the function Food(name, price), then we invoke the function Product.call(this, name, price) and pass this to Product(name, price). In Product(name, price), actually we are modifying Food, because we passed this in Product.call(this, name, price). So that this points to object Food. And we assign name and price to this(which is the reference of Food).
So, it’s the object Food which is being modified and finally we have name, price and category in Food.


Some people may say that we may implement like this:

function Product(self, name, price) {
    self.name = name;
    self.price = price;
    console.log(self);
    if (price < 0) {
        throw RangeError('Cannot create product ' + self.name + ' with a negative price');
    }
}

function Food(name, price) {
    Product(this, [name, price]);
    console.log(this.price);
    this.category = 'food';
}

console.log((new Food('Cake', 5)).price);

But actually it won’t work. Because JavaScript is a little bit different. Even though Product and Food are 2 objects. But when we pass arguments to this 2 “functions”, it will make a copy of the parameter that we passed, not the reference.
So that it’s in vain to do so.

If somebody have another implementation, please leave it in comment area.

版权声明:本文章禁止商业使用,非商用转载必须注明出处和作者。作者保留一切权利。 举报

相关文章推荐

Javascript中闭包(closure)的理解与浅析

最近在网上查阅了不少Javascript闭包(closure)相关的资料,写的大多是非常的学术和专业。对于初学者来说别说理解闭包了,就连文字叙述都很难看懂。撰写此文的目的就是用最通俗的文字揭开Javascript闭包的真实面目。 一、什么是闭包? “官方”的解释是:闭包是一个拥有许多变量和绑定了这些变量的环境的表达式(通常是一个函数),因而这些变量也是该表达式的一部分。相信很少有人能直

Closure, Memory Leak and Memory Diagnose

what is Closure 从概念上讲, Closure是一种语言机制,它的出现是为了满足函数式编程(functional programming lauguage)的某种设计需求, 即,为在函...

欢迎关注CSDN程序人生公众号

关注程序员生活,汇聚开发轶事。

javascript事件轮询(event loop)详解

<h1 class="entry-title" style="margin-bottom: 0px; padding-right: 5px; padding-left: 5px; border: 0px; font-family: museo-sans-1, museo-sans-2, sans-serif; font-size: 36px; font-weight: normal; line-height: 36px; vertical-align: base

full stack javascript

So, you and your co-founder have this great idea for a business, right? You’ve been addin...

(新增官方回复)对【无类语言的OOP(JavaScript描述) 】一贴中第一个代码段的不同意见

网站:JavaEye 作者:keshin 发表时间: 2007-07-16 10:28 此文章来自于 http://www.iteye.com 声明:本文系JavaEye网站原创文章,未经JavaEye网站或者作者本人书面许可,任何其他网站严禁擅自发表本文,否则必将追究法律责任! 原文链接:<a href='
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)