Level 116
Level 118
99 words 0 ignored
Ready to learn
Ready to review
Ignore words
Check the boxes below to ignore/unignore words, then click save at the bottom. Ignored words will never appear in any learning session.
Ignore?
What are two drawbacks of the Constructor Stealing pattern?
Methods of a constructor are not shared amongst new instances.
What is the most common way of implementing inheritance in Javascript?
Combination (Pseudoclassical) Inheritance applies both the Prototype Chaining pattern and Constructor Stealing pattern.
function object(proto) {
What is the basic pseudocode for the Prototypal Inheritance pattern?
Object.create(proto[, properties])
What native function implements the equivalent of Prototypal Inheritance's "object(proto)" function? What standard and version was it introduced in?
When might you consider using the Prototypal Inheritance pattern?
When you need one object to have similar behavior as another object, but do not need to create unique constructor functions (custom types).
How do you implement the Parasitic Inheritance pattern?
Like the factory pattern, except instead of using the new operator or object literal, invoke another factory pattern (function) inside the function to obtain your object to augment.
Why is the Parasitic Combination Inheritance pattern superior to Combination Inheritance?
The super type constructor function is called only once and so you avoid having duplicate properties on the instance and the prototype.
What is function hoisting?
when a function that is declared with a name is parsed first so visible before its declaration
What is a function expression?
A named function enclosed within parentheses.
Use a function expression
When definining a recursive function in strict mode, what should be done instead of arguments.callee?
What is a closure
inner function having accessing an outer functions variables
10
What does result[5]() return?
How would I declare a private block scope to avoid polluting the global scope?
The syntax of an anonymous function used as a block scope (often called a private scope) is:
What is a privileged method:
A public method that has access to private variables and/ or private functions .
Module pattern or module augmentation pattern
What patterns would be used to define privileged methods on a singleton?
Global
Variables defined outside a function are _______ variables and their scope is _______.
Global / Window
variables and functions declared outside of an object scope as implicitly added to the _______ object?
alert
Popup Boxes
setTimeout or setInterval
You can schedule code to execute at a specific point in time by using either of these functions:
Capability Detection
The most widely accepted method of client Detection is called?
Modernizr (modernizr.com)
What common library is used to simplify capability detection? (Not from the reading)
No
Do we need to use the word var inside the parentheses?
UserAgent string
What is the best way to try and determine the browser that the client is using?
Node, Document, and Element
What are the three main "types" defined in the DOM
getElementById() and getElementsByTagName()
What are two methods for locating elements within the document?
What's the most important thing to remember about DOM manipulation?
It is some of the most performance expensive operations that can be done in Javascript
jQuery
Quote one JavaScript framework?
Event Bubbling, all modern browsers support it.
Which event flow concept starts at the most specific element and fires on each successively less specific node?
HTML Event Handlers,
What are the four native types of event handlers?
The event object.
For event handlers assigned using DOM Level 0 Events or DOM Level 2 Events methods, what is the sole argument?
False.
Javascript is not case sensitive.
The hashchange event notifies developers when the URL hash changes.
What does the hashchange event do? What were developers doing that made such an event useful?
True or False, informing the developer of movement is not the purpose of the device orientation event?
True, the deviceorientation event informs the developer of the device's orientation, while the devicemotion event informs the developer when the device is moving
False, placing events on each element increases memory usage and delays interactivity.
True or False, in JavaScript, developers keep memory usage low and avoid delays in interactivity with the page by placing an event on each element the user is supposed to interact with, such a…
What technique can developers use to keep memory usage low and avoid delays in interactivity?
Developers can take advantage of event bubbling to assign a single event handler to manage all events of a particular type, a technique called Event Delegation.
What are two actions that can result in dangling event handlers?
Removing an element, such as by overwriting innerHTML, before removing the event handlers on that element.
Assigning the form an ID and accessing via document.getElementById().
What are three different ways to access a specific form element via JavaScript?
The value they had when the page was first rendered.
When a reset button is pressed, all of the form fields are set back to what value?
An HTMLCollection containing all the elements with the name.
If multiple form controls share the same name, such as a set of radio buttons, what will the "elements" collection property of the form object return, using the common name as the index?
</script>
a return statement
selectionStart, selectionEnd.
What "HTML5" textbox properties can be used to get the selected text?
setSelectionRange()
What "HTML5" textbox method can be used to select some of the text?
before copy, copy, beforecut, cut, beforepaste, paste.
What are the six events related to the clipboard?
The index of the first option that was selected.
For a multiple select box that has multiple options selected, what does selectedIndex return?
What are two ways to enable rich text editing in your page?
Embed an iframe containing a blank HTML page, set the "designMode" property of the iframe's document object to "on".
What is XDM?
cross-document messaging, sometimes abbreviated as XDM, is the ability to pass information between pages from different origins.
Postmessage()
What command is used to pass data into another location?
In XDM what is that other location?
That other location is an <iframe> element or pop-up window owned by the page.
What arguments does the postmessage method accept?
1.A message String indicating the intended recipient origin.
What security benefit does the second argument provide?
It restricts where the browser will deliver the message.
Iframe contentwindow
What do all browsers that support XDM also support?
Give an example of XDM.
Var iframewindow = document.getelementbyid ("myframe").contentwindow;
What is the function of the last line?
The last line attempts to send a message into the iframe and specifies that the origin must be
Postmessage () silently does nothing.
What happens if the origin does not match the message, and why?
How can you allow posting to any origin?
Pass in "*" as the second argument to postmessage (),
What happens when an XDM message is received?
A message event is fired on a window
How is the message fired and why is that important?
This message is fired asynchronously so there may be a delay between the time at which the message was sent and the time at which the message event is fired in the receiving window.
An onmessage event handler
Where is the event object passed to?
What three important pieces of information does that event object have?
Data — the string data that was passed as the first argument to postmessage ().
What is the primary purpose of the proxy?
To execute the postmessage () method on the window that sent the last message. If the sending window has the same origin, this may be the actual window object.
It ensures that data doesn't get passed unintentionally to an unknown page.
why is it very important when receiving a message to verify the origin of the sending window?
What is the basic messaging pattern?
Eventutil.addhandler (window, "message", function (event) {//ensure the sender is expected
Why should you use postmessage () instead of event.source
Event.source is a proxy for a window in most cases, not the actual window object, so you can't access all of the window information. It's best to just use postmessage (), which is always present and always callable.
What is quirky about XDM?
The first argument of postmessage () was initially implemented as always being a string. The definition of that first argument changed to allow any structured data to be passed in; however, not all browsers …
What should you do if you need to pass structured data?
The best approach is to call json.stringify() on the data, passing the string to postmessage() , and then call json.parse() in the onmessage event handler.
Why is XDM frequently used in mashups and social networking applications?
The containing page is able to keep itself secure against malicious content by only communicating into an embedded iframe via XDM.
yes
Can functions be used in expressions?
Web messaging
When Xdm was separated out into its own specification. What did they name it?
In HTML5 what is perhaps the most interesting thing about drag-and-drop support
Elements can be dragged across frames, browser windows, and sometimes, other applications.
How does dragstart function?
At the moment you hold a mouse button down and begin to move the mouse, the dragstart event fires on the item that is being dragged. The cursor changes to the no-drop symbol (a circle with a
How can you run javascript code as the dragging begins?
You can use the ondragstart event handler to run javascript code as the dragging begins.
How does the drag event function work?
After the dragstart event fires, the drag event fires and continues firing as long as the object is being dragged. This is similar to mousemove, which also fires repeatedly as the mouse is moved.
When is the dragend event fired?
When the dragging stops (because you drop the item onto either a valid or an invalid drop target),
When does the dragenter event fire?
The dragenter event (similar to the mouseover event) fires as soon as the item is dragged over the
When does the dragover event function?
Immediately after the dragenter event fires, the dragover event fires and continues to fire as the item is being dragged within the boundaries of the drop target.
When does the dragleave event fire?
When the item is dragged outside of the drop target, dragover stops firing and the dragleave event is fired (similar to mouseout).
The drop event fires instead of dragleave.
What happens if the dragged item is actually dropped on the target?
what happens when you try to drag something over an invalid drop target?
You see a special cursor (a circle with a line through it) indicating that you cannot drop.
Not to allow dropping.
What is the default setting for allow drop?
How can you turn any element into a valid drop target?
By overriding the default behavior of both the dragenter and the dragover events.
var droptarget = document.getelementbyid("droptarget");
If you have a <div> element with an id of "droptarget" what does the code look like to turn it into a drop target:
Why did internet explorer 5 introduced the datatransfer object?
To aid in the transmission of data via a drag-and-drop operation.
What is the datatransfer object, and what does it do?
It exists as a property of event and is used to transfer string data from the dragged item to the drop target.
Does the datatransfer object exist outside the scope of an event handler of a drag-and-drop event?
Because it is a property of event, the datatransfer object doesn't exist except within the scope of an event handler for a drag-and-drop event.
What is the datatransfer object now a part of?
The datatransfer object is now part of the working draft of html5.
Getdata() and setdata() .
What are the two primary methods of the datatransfer object?
What does getdata do?
Getdata () is capable of retrieving a value stored by setdata() .
How does html 5 extend the valid data types?
Even though internet explorer started out by introducing only "text" and "url" as valid data types, html5 extends this to allow any mime type to be specified. The values "text" and "url" will be suppo…
What types can the datatransfer object be?
The datatransfer object can contain exactly one value of each mime type, meaning that you can store both text and a url at the same time without overwriting either.
Only until the drop event.
How long is data stored in the datatransfer object
The datatransfer object is destroyed and the data is lost.
What happens if you do not retrieve the data in the ondrop event handler?
what happens when you drag text from a text box?
The browser calls setdata() and stores the dragged text in the "text" format.
Setdata() is called and the url is stored.
What happens when a link or image is dragged
By using getdata() .
How is it possible to retrieve these values when the data is dropped on a target
Call setdata() manually during the dragstart event
How can you store custom data that you may want to retrieve later.
When dropping data onto another browser how are url's treated different than other text?
When you specify data to be stored as a url it is treated just like a link on a web page, meaning that if you drop it onto another browser window, the browser will navigate to that url.
what special abilities does the datatransfer object have?
The datatransfer object can be used to do more than simply transport data to and fro; it can alsobe used to determine what type of actions can be done with the dragged item and the drop target.
dropeffect and effectallowed.
What properties determine what type of actions can be done with the dragged item and the drop target
what is the purpose of the dropeffect property
To tell the browser which type of drop behaviors are allowed.
