JavaScript - Software development and programming

Showing posts with the label JavaScript

The approach you take when creating a "class"

What style do you use for creating a "class"? There are a few ways to get class-like behavior in javascript, the most common seem to be prototype based like this: function Vector(x, y, x) { this.x = x; this.y = y; this.z = z; return this; } Vector.prototype.length = function () { return Math.sqrt(this.x * this.x ... ); } and closure based approaches similar to function Vector(x, y, z) { this.length = function() { return Math.sqrt(x * x + ...); } } For various reasons the latter is faster, but I've seen (and I frequently do write) the prototype version and was curious as to what other people do. My tests have shown that the closure based approach is slower. You have to instantiate a separate closure for each object. The prototype approach shares the methods with all instances. 7 Answers Assigning functions to the prototype is better (for public methods) because all instances of the class will share the same copy of the method. If you assign t...

How can I enable disabled radio buttons? The following code works great in IE, but not in FF or Safari. I can't for the life of me work out why. The code is supposed to disable radio buttons if you select the "Disable 2 radio buttons" option. It should enable the radio buttons if you select the "Enable both radio buttons" option. These both work... However, if you don't use your mouse to move between the 2 options ("Enable..." and "Disable...") then the radio buttons do not appear to be disabled or enabled correctly, until you click anywhere else on the page (not on the radio buttons themselves). If anyone has time/is curious/feeling helpful, please paste the code below into an html page and load it up in a browser. It works great in IE, but the problem manifests itself in FF (3 in my case) and Safari, all on Windows XP. function SetLocationOptions() { var frmTemp = document.frm; var selTemp = frmTemp.user; if (selTemp.selecte...

What's the difference in closure style There are two popular closure styles in javascript. The first I call anonymous constructor : new function() { var code... } and the inline executed function : (function() { var code... })(); are there differences in behaviour between those two? Is one "better" over the other? 5 Answers Both cases will execute the function, the only real difference is what the return value of the expression may be, and what the value of "this" will be inside the function. Basically behaviour of new expression Is effectively equivalent to var tempObject = {}; var result = expression.call(tempObject); if (result is not an object) result = tempObject; Although of course tempObject and result are transient values you can never see (they're implementation details in the interpreter), and there is no JS mechanism to do the "is not an object" check. Broadly speaking the "new function() { .. }" meth...

Getting the text from a drop-down box

Getting the text from a drop-down box This gets the value of whatever is selected in my dropdown menu. document.getElementById('newSkill').value I cannot however find out what property to go after for the text that's currently displayed by the drop down menu. I tried "text" but that didn't have the answer, does anybody here know? For those not sure, here's the HTML for a drop down box. <select name="newSkill" id="newSkill"> <option value="1">A skill</option> <option value="2">Another skill</option> <option value="3">Yet another skill</option> </select> 14 Answers Based on your example HTML code, here's one way to get the displayed text of the currently selected option: var skillsSelect = document.getElementById("newSkill"); var selectedText = skillsSelect.options[skillsSelect.selectedIndex].text; For those late to the party,...

How to specify javascript to run when ModalPopupExtender is shown The ASP _ NET AJAX ModalPopupExtender has OnCancelScript and OnOkScript properties, but it doesn't seem to have an OnShowScript property. I'd like to specify a javascript function to run each time the popup is shown. In past situations, I set the TargetControlID to a dummy control and provide my own control that first does some JS code and then uses the JS methods to show the popup. But in this case, I am showing the popup from both client and server side code. Anyone know of a way to do this? BTW, I needed this because I have a textbox in the modal that I want to make a TinyMCE editor. But the TinyMCE init script doesn't work on invisible textboxes, so I had to find a way to run it at the time the modal was shown. They show you how to RAISE an event manually, not not how to attach to it: asp _ net _ ajaxlibrary _ act_modalpopup.ashx ...priceless 8 Answers hmmm... I'm pretty sure that there...

Length of a JavaScript object

Length of a JavaScript object I have a JavaScript object. Is there a built-in or accepted best practice way to get the length of this object? const myObject = new Object(); myObject["firstname"] = "Gareth"; myObject["lastname"] = "Simpson"; myObject["age"] = 21; that's kinda true, but so many people are used to PHP's "associative array" that they might assume it means "ordered associative map", when JS objects are in fact unordered. In the above example, myObject.length is undefined, at least in a browser environment. That's why it isn't valid Variants of Object.{keys, values, entries}(obj).length have now been mentioned a total of 38 times in 16 answers plus in the comments of this question, and another 11 times in 7 deleted answers. I think that’s enough now. 44 Answers Updated answer Here's an update as of 2016 and widespread deployment of ES5 and beyond. For IE9+ and all other moder...