Home › Forums › JavaScript › Is this a method?
- This topic is empty.
-
AuthorPosts
-
August 9, 2014 at 12:11 pm #178408
nixnerd
ParticipantIs the variable ‘rules’ a method?
var rules = { required: function(x) { return !!x }, email: function(x) { return emailRegex.test(x) }, phone: function(x) { return phoneRegex.test(x) } } var validate = function(value, rule) { return rules<a href="value">rule</a> } input.addEventListener('keyup', function() { var isValid = validate(this.value, this.dataset.rule) this.classList.toggle('valid', isValid) })
August 9, 2014 at 2:11 pm #178419__
Participantno, it’s a plain object which contains methods.
August 9, 2014 at 7:56 pm #178431Alen
ParticipantJavaScript objects have no methods. Objects have properties that contain function objects. :)
August 9, 2014 at 8:08 pm #178434__
ParticipantJavaScript objects have no methods. Objects have properties that contain function objects. :)
: p
August 13, 2014 at 10:21 pm #178967christopherfuston
ParticipantNo
August 14, 2014 at 10:49 am #179087nixnerd
ParticipantDamn. Still kinda lost. I’ll keep plugging away and see if I can figure out what I need to.
August 14, 2014 at 11:44 am #179093JacobPeters
ParticipantJavaScript objects have no methods. Objects have properties that contain function objects. :)
I would have to disagree with that. Objects have ‘.prototype’ that holds their methods, and I think that functions in the module pattern are very method like. Properties define state. Methods define actions on that state.
Also, if you want to call everything in an Object a property, then Objects have properties that are function objects. The Object contains function objects. The Object’s property is a function object.
(note: I’m not saying that objects must contain function objects or that all object properties have to be function objects)August 14, 2014 at 12:49 pm #179100__
ParticipantI can’t speak for him, but I don’t think @alenabdula’s comment was an argument as much as a technical point.
From a practical perspective, function properties are methods, because that’s how you use them. But they are implemented in exactly the same way as non-function properties, and —in terms of how they are assigned, referenced, etc.— are functionally indistinguishable. You can’t tell the difference until you inspect the value of the property itself. Even an object’s
.prototype
is really just a named property that refers to the object it inherits from.Joe, what are you “lost” on?
August 14, 2014 at 1:19 pm #179101nixnerd
ParticipantJoe, what are you “lost” on?
Quite honestly I’m not sure. This is a rough piece of code for a form I’m building (but not working on today). Basically, I’m trying to have proper abstraction/separation. Basically, I need to house all the rules for the input fields in an object… and I guess pass the input to that object for everything to be checked.
Does that make sense?
All I know is… I was doing this with if/else… which apparently makes me a horrible person.
August 14, 2014 at 4:19 pm #179121__
ParticipantYou want something like this?
var validator = (function(){ var onChange = function( input,rule ){ try{ if( typeof thisObject[rule] !== 'function' ){ throw new Error( '"'+rule+'" is not a rule' ); } if( ['INPUT','SELECT','TEXTAREA'].indexOf( input.tagName ) === -1 ){ throw new Error( '[input] is not a form input' ); } if( thisObject[rule]( input.value ) ){ input.classList.remove( 'invalid' ); input.classList.add( 'valid' ); return true; } else{ input.classList.remove( 'valid' ); input.classList.add( 'invalid' ); return false; } } catch( e ){ /* do error handling stuff */ } }, RX = { email: /put your regex here/, phone: /put your regex here/ }, thisObject = { addRule: function( input,rule ){ input.addEventListener( 'change', function(){ onChange( input,rule ); }, false ); }, required: function( value ){ return !!value; }, email: function( value ){ return RX.email.test( value ); }, phone: function( value ){ return RX.phone.test( value ); } }; return thisObject; })();
A few things could be better, but this works so far. Since you used
.classList
in your original code, I figured you don’t need to worry too much about IE.August 14, 2014 at 7:25 pm #179131nixnerd
ParticipantI need to take a look at that. However… I didn’t write the original code. Some dude on #Javascript IRC channel did.
I’m going to need to go through it step by step to really understand. I hate taking code on faith.
Thanks for writing up that example dude. Really appreciate it.
August 14, 2014 at 7:43 pm #179133JacobPeters
ParticipantHere it is implemented in a slightly different way. I know it always helped me to see how different people implemented the same thing when I was learning.
http://codepen.io/jacobcpeters/pen/qAILc
__, I basically stole your functions but implemented them in a more traditional OOP way.
Also, I like keyup better than change for input validation. I feel it gives more useful feedback to the user.
August 14, 2014 at 8:13 pm #179135nixnerd
ParticipantWow… you guys are amazing. I can’t wait to dig into this tomorrow. Amazing.
August 14, 2014 at 8:22 pm #179136Alen
Participant@JacobPeters good stuff
August 14, 2014 at 8:50 pm #179137JacobPeters
ParticipantPersonally, I see methods as a pattern more than anything else. OOP is just a code organization pattern. It all gets turned into machine code. Variables and functions are both the same at that point. There is no differentiation between private and public functions when you get down to it. It’s all 1’s and 0’s.
Functions are instruction data, and variables are state data. Methods are functions that operate on a group of variables. In C++ a class is essentially a struct for each instance of the class and a virtual method table (vtable). When you call a class method you lookup the memory address of the method in the vtable. Then the method is called with a pointer to memory address of the state struct as the first argument of the function.
In short, you write this:
classInstance.classMethod(x, y)
, and what really happens is this:classMethod(&classInstance, x, y)
.That first argument is the this pointer. However, javascript’s this doesn’t work the same way though, and it can make things frustrating sometimes. I think this is why some say that javascript doesn’t have methods, but I reject that. Methods are not syntax sugar to make working with state variables easier. They are simply functions that work on a group of state variables. Any language can implement that.
The fact that javascript is dynamically typed and functions look the same as variables in the implementation is completely orthogonal to the discussion of whether methods can or cannot exist in a language.
-
AuthorPosts
- The forum ‘JavaScript’ is closed to new topics and replies.