-1

I am relatively new to javascript, but have learned alot about OO programming from using Java. Either javascript is not very OO or I am missing something. Java has classes with methods much like javascripts functions, but I noticed that javascript functions also act as class objects not just methods. I am confused if a function can become an object shouldn't that object be able to have usable functions?

Javascript implementation:

function Div() {

var div = document.createElement('div');

 function setSize(width,height){

    div.position = 'absolute';

    div.style.width = width + 'px';
    div.style.height = height + 'px';
    div.style.background = 'black';

    document.body.appendChild(div);


}

}

HTML Script

<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
    <script type="text/javascript" src="jWebKit.js"></script>

    <script>

        var div1 = new Div();
        div1.setSize(100,100); //Does Not Work Irritating all whom love Java...

    </script>
</body>
</html>
StoneAgeCoder
  • 923
  • 1
  • 7
  • 13
  • 2
    I'd recommend seeking out resources to properly learn JavaScript, rather than relying on your Java intuition. – Ismail Badawi Jun 11 '14 at 20:17
  • 1
    You have to read some more tutorials... I'd start here https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain – elclanrs Jun 11 '14 at 20:17
  • `this.setSize = function(width, height) {...` – tymeJV Jun 11 '14 at 20:18
  • Those are all local variables. – SLaks Jun 11 '14 at 20:18
  • @IsmailBadawi I am starting not to like javascript already. I thought most languages rely on Object Oriented style to create and construct objects. I have never been so disappointed. – StoneAgeCoder Jun 11 '14 at 20:19
  • you need to publish your methods in the constructor by tacking them onto "this"; not every var/function is published by name automatically. or use prototype for inherited methods. – dandavis Jun 11 '14 at 20:21
  • JavaScript doesn't have classes (yet). TypeScript (which is Microsoft bastardization, compiles back to JavaScript) does support classes like Java http://www.typescriptlang.org/Tutorial – Halcyon Jun 11 '14 at 20:22
  • 2
    @StoneAgeCoder: Like very language, you have to learn how it works first. Every language has its unique properties. – Felix Kling Jun 11 '14 at 20:22
  • @Halcyon: I doubt JS (ES) will ever get classes. If you mean the `class` syntax in ES6, that's just syntactic sugar. – Felix Kling Jun 11 '14 at 20:23
  • It would make it easier thats for sure if they did. Java is so easy to use and learn I don't understand why they have to rely on 3 seperate languages to do web programming. Why not one OO language to simplify things? – StoneAgeCoder Jun 11 '14 at 20:25
  • 1
    @StoneAgeCoder JavaScript doesn't have classical inheritance, it has prototypical inheritance which is more powerful (it can emulate classical inheritance). As for why it was designed like this? pester Brendon Eich. – Halcyon Jun 11 '14 at 20:27
  • whoever voted down i am now deleting this post to avoid getting banned sorry everyone. – StoneAgeCoder Jun 11 '14 at 20:28
  • 1
    Keep in mind that this is just your personal opinion. And there are many more than just 3 programming languages in the world. Each of them has advantages and disadvantages. If we only had Java for server side programming, I don't think we had a WWW at all today. – Felix Kling Jun 11 '14 at 20:28
  • nvmd i would get banned either way lol – StoneAgeCoder Jun 11 '14 at 20:31
  • 1
    @StoneAgeCoder Java is harder to learn than many other OO languages precisely *because* of its high ceremony and inflexibility. That inflexibility, and its impoverished models of abstraction, is what drives large numbers of people *away* from it. – Dave Newton Jun 11 '14 at 20:55
  • @DaveNewton Java or Javascript? I think it depends on the person. I was saying javascript was harder for me because it seems to be incredibly different than java. I personally love Java. – StoneAgeCoder Jun 11 '14 at 21:01
  • 1
    @StoneAgeCoder Java. JavaScript isn't harder because it's different from Java--"different" doesn't make things harder or easier. The *nature* of those differences, and *how you approach them*, is what makes `different == hard`. You may like Java, but it's not because it's "easier" than JavaScript, or because it's "better". Personally I find it stifling, unforgiving, and extra-work-creating because of its inflexibility and limited number of abstractions. I have yet to run into anyone that thinks it's their favorite language except when they don't know any more expressive ones. – Dave Newton Jun 11 '14 at 21:06
  • Can someone explain to me why they voted down now I am one step closer to being banned trust me i know it does not take much. I like using this site to ask questions if you thinks its dumb keep it to yourself i don't like being banned due to someone elses rude opinion just saying... – StoneAgeCoder Jun 11 '14 at 21:17
  • 1
    I'm not your down-voter, though I almost did due to your mis-tagging your question as a Java question; however this has since been corrected. Maybe someone thought that you asked your question before doing enough of your own research on the subject first, but who knows, and you may never know why folks vote the way they do. – Hovercraft Full Of Eels Jun 11 '14 at 21:29
  • @HovercraftFullOfEels I did research on my own, but nothing really satisfied me right away mainly on similar questions asked over stackoverflow. I am just trying to learn here and don't mean to offend anyone by asking the question wrong, but I have already been banned once over just a couple questions because of downvoters and don't intend to try to insult people with stupid questions just for that reason. – StoneAgeCoder Jun 11 '14 at 21:33
  • 1
    @StoneAgeCoder: again, I'm just guessing, and we may never know. Just keep asking, and keep trying to improve your questions. Jon Skeet's blog, [Writing the Perfect Question](http://msmvps.com/blogs/jon_skeet/archive/2010/08/29/writing-the-perfect-question.aspx) has helped me to ask better questions, and can help you too. – Hovercraft Full Of Eels Jun 11 '14 at 21:34
  • 2
    @StoneAgeCoder: Just a last note: You find Java easy because you are familiar with it. I find JavaScript easy because I'm familiar with it. To learn something new, you have to put effort into it, which might be conceived as "difficult". Especially when the new thing is based on different concepts that challenge your current understanding of things. But I guess that's just how life is :) – Felix Kling Jun 11 '14 at 21:41
  • @FelixKling Agreed I guess I need to approach it with a better attitude than just down playing the languages significance. Javascript makes manipulation of HTML DOM elements a whole lot easier that's for sure. XD – StoneAgeCoder Jun 11 '14 at 21:47

2 Answers2

3

MDN has a nice introduction to OOP. Basically, make div and setSize properties of each instance of Div:

function Div() {
    this.div = document.createElement('div');
}

Div.prototype.setSize = function(width,height) {
    this.div.style.width = width + 'px';
    this.div.style.width = height + 'px';
};

Instance properties are created inside the constructor, "shared" properties between instances are stored on the prototype. ES6 introduces a new class syntax, which is probably closer to what you are used to, but underneath it just creates a constructor function and adds properties to the prototype.

Felix Kling
  • 795,719
  • 175
  • 1,089
  • 1,143
  • One question so prototype performs like a Java method therefore i should be able to call new Div().setSize(); and it will work? – StoneAgeCoder Jun 11 '14 at 20:22
  • JS has [prototype inheritance](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Inheritance_and_the_prototype_chain). If an object doesn't have a property itself, it's looked up in its prototype chain. Every instance of a constructor function (`Func`) inherits from the `Func.prototype` property. – Felix Kling Jun 11 '14 at 20:24
1

Your setSize method is not defined as a member of the class here but as a function where the scope is limited to that function.

There are many ways and documentation out there to explain how it works, but here you could have declared your function this way:

function Div() {// Acts as a class?

    this.div = document.createElement('div');
    this.setSize = function(width,height){
        this.div.style.width = width + 'px';
        this.div.style.width = height + 'px';
    }
}
spaque99
  • 86
  • 3