• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Devaka Cooray
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Jeanne Boyarsky
  • Tim Cooke
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Tim Moores
  • Mikalai Zaikin
  • Carey Brown
Bartenders:

javascript anonymous function constructor with error

 
Ranch Hand
Posts: 300
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator


just a simple test, I want to learn javascript anonymous function constructor with argument, but when I call

console.log(wb_sys(20,10).getArea());
console show eror

Uncaught TypeError: wb_sys is not a function at jsTest2.html:16:13

what wrong is it?
 
Sheriff
Posts: 67735
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Also, in modern JavaScript you’d either use a named function, or assign an arrow function to a const. “new function” is just weird.

It’s also not completely clear what you are trying to accomplish here. That info would help.
 
Saloon Keeper
Posts: 15255
349
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
It appears that you're trying to create an object by making a call to an anonymous constructor.

The problem is that you're not calling the constructor properly, and you're also not treating the result as the constructed object.

If you use the new keyword, you must make a call to a constructor immediately afterward. You declared the constructor, but you didn't call it.

This is probably what you were looking for:

I don't hold this kind of code in high regard though. You're better off just using named constructors.
 
Bear Bibeault
Sheriff
Posts: 67735
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

Stephan van Hulst wrote:
I don't hold this kind of code in high regard though.


Exactly. Good code is all about clarity. Follow established conventions and avoid "clever" code.
 
peter tong
Ranch Hand
Posts: 300
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I write this testing code because I find my project has many similar code like following:



I think it is anonymous function constructor?
As I see other javascript file can just call like the following

in fact I don't know what is doing in code like


I guess it define an object wb_sys_param using the anonymous new function(){...}
am I right?
 
Bear Bibeault
Sheriff
Posts: 67735
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Your example differs from the example you provided in that you have params and the example doesn't.

When you don't call the constructor (see Stephan's example) with param values, the object is created without any params.

The difficulty seems to be that you are expecting new function to return a constructor, when it's actually returning the object that results from the constructor.

In modern JS, you wouldn't see code like this. As this seems to be using object-oriented techniques, you'd see the new class syntax being used. Alternatively, object-oriented approaches would be tossed out the window in favor of functional techniques.
 
Bear Bibeault
Sheriff
Posts: 67735
173
Mac Mac OS X IntelliJ IDE jQuery TypeScript Java iOS
  • Likes 1
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Let's use some examples:

In older code, normally you'd see a constructor created as a named function


And an instance created with:


Note that if you don't provide an explicit param list, an empty one is provide for you. So:

acts like:


Now, switching to anonymous functions, where you provide the function body inline:

acts like

calling the anonymous constructor without a value for the parameter. Which you don't want.

So look at Stephan's code again to see how the parameters are provided, and an instance, not a constructer is stored in wb_sys.
 
peter tong
Ranch Hand
Posts: 300
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
why
new function(value) { /* whatever */ }
act like
new function(value) { /* whatever * }()
?


Anyway, I got what Stephan mean now

If you use the new keyword, you must make a call to a constructor immediately afterward.


so I must pass the parameter value immediately after the constructor definition.
 
Stephan van Hulst
Saloon Keeper
Posts: 15255
349
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator

peter tong wrote:why
new function(value) { /* whatever */ }
act like
new function(value) { /* whatever * }()
?


It's just one of the quirks of JavaScript. JavaScript also allows you to call a function with fewer arguments than there are parameters. The parameters will then have an undefined value. In general, you should not rely on this behavior.

so I must pass the parameter value immediately after the constructor definition.


Correct.
 
I have gone to look for myself. If I should return before I get back, keep me here with this tiny ad:
a bit of art, as a gift, the permaculture playing cards
https://gardener-gift.com
reply
    Bookmark Topic Watch Topic
  • New Topic