Microsoft exam 480
Microsoft partner
certification
For companies and individuals
Our status
with ambitions to be a
Gold partner
Our status
6
Certified technicians
The range of tests
60+
exams
https://www.microsoft.com/en-gb/learning/exam-list.aspx
Benefits
A) Credentials with potential clients
B) Free software licences
C) An accolade for your CV
What's tested in 480?
Implement and manipulate document structures and objects (24%)
Use CSS3 in applications (25%)
https://www.microsoft.com/en-gb/learning/exam-70-480.aspx
Topics
Basic JS
Call - accepts this and a series of individual args
Apply - accepts a list of args as an array
This - meaning in different contexts
Callbacks - how to implement
Parsing JSON
Parsing Strings
Topics
Regex
// open close regex statement
\escape character
[] for range of characters e.g. 1-3 or a-f
[^] for range of characters you don’t want to match
{} for range of items to act on - can accept two digits: min and max values
. for any character (except newlines)
\d for digit
\w for word character
\s whitespace
\b
i for case insensitivity
? optional character
() for subgroup
Topics
Regex cont.
test() - returns boolean for match
match() - returns an object with the match or null
replace() - returns the new string. A function can be passed in as second argument
exec() - similar to match but can return multiple groups
Topics
Web Workers
Two types: Dedicated and shared
Created with the new keyword e.g. new Worker(‘my-woker.js’);
postMessage - send data to the worker, which accepts string or JSON
Transferable objects (File, Blob, ArrayBuffer and JSON) also uses postMessage but second argument is ArrayBuffer that lists all objects
this, self - the global scope for the worker
NB messages between main thread and worker are copied not shared
worker.terminate or
self.close to stop a worker
Topics
Web Workers
available methods are:
- setTimeout/clearTimeout
- setInterval/clearInterval
- XHR
- navigator
- location
- appCache
Topics
Application cache
Cache manifest file must be mime type text/cache-manifest via web server or .htaccess like so AddType text/cache-manifest .appcache
Include relevant attribute in html tag e.g. manifest="example.appcache"
The file itself begins with CACHE MANIFEST
and then lists all the files to cache with no punctuation
file can be from another domain
It is very sensitive - failure to download a resource causes a fail and is deleted entirely if it returns a 404 or 410
CACHE - list all files to be cached
NETWORK - list of files that can come from the network i.e. NOT cached
FALLBACK - files to load if resource is unavailable
Reach it via window.applicationCache object which has a status property
Important - your site will use the cache even if you’re online. So no updates work unless you update the manifest :[
Topics
jQuery
Extensions
The colon selector can be used to select all items of a type e.g.
$(‘:button’) will select both <button> and <input type=“button”>
$(‘:header’) will get all the headings
AJAX
data: the data you’re sending e.g. {city: ‘boston’}
dataType : data format, you are expecting from the server
contentType : data format, you are sending to the server
Topics
jQuery Selectors
Attribute Ends With Selector [name$=”value”]
Attribute Starts With Selector [name^=”value”]
Notice how the two above use the same symbols as Regex
Attribute Contains Prefix Selector [name|=”value”] - i.e. proceeded by a hyphen
Attribute Contains Word Selector [name~=”value”]
Topics
JS Classes
To inherit a class assign to the prototype property of another
e.g.
function User() {}
function Admin() {}
Admin.prototype = new User();
Topics
Storing Data
Cookies are sent to the server,
only store 4kb and persist after browser restart
LocalStorage stores up to 10Mb, does not send to the server and persists
Session does not persist nor send to the server
Topics
HTML5 Audio/Video
Setting the source
playback control: play, pause, stop etc.
Topics
Canvas
strokeStyle
fillStyle
fill() - after a shape has been drawn e.g. rect(); fill()
fillRect
fillText
context.rotate(angle)
Topics
GeoLocation
getCurrentPosition - callback that provides a position object with latitude and longitude properties
The object’s variable name is defined inside the success callback
navigator.geolocation.getCurrentPosition(success[, error[, options]])
watchPosition - callback for updates
clearWatch
Topics
Connection
if (navigator.onLine) {
console.log('online');
} else {
console.log('offline');
}
Topics
APIs
SOAP uses POST
REST uses either but often GET
Topics
Form input and attr types
- pattern - a regex pattern
- url
- month - month year number/calendar
- week - week year number/calendar
- datetime-local
- range (max, min and step set by default)
- step - numeric value to divide by (steps in range)
Topics
WebSockets
Events:
- open
- message
- error
- close
url is any regular url string that links to the sockets server e.g. ‘www.mysite.com/mysocketsserver’
Topics
URIs
- encodeURI is intended for use on the full URI.
- encodeURIComponent is for a URI that has any part that lies between separators (; / ? : @ & = + $ , #)
In encodeURIComponent these separators are encoded also because they are regarded as text and not special characters.
Topics
Error handling
try, catch, finally and throw
e.g.
try {
something();
throw new Error(‘oops’);
}
catch(e) {
console.erros(e.message);
}
finally {
}
Topics
Data lists
The HTML <datalist> element contains a set of <option> elements that represent the values available for other controls.
<label>Choose a browser from this list: <input list="browsers" name="myBrowser" /></label> <datalist id="browsers"> <option value="Chrome"> <option value="Firefox"> <option value="Internet Explorer"> <option value="Opera"> <option value="Safari"> <option value="Microsoft Edge"> </datalist>
Not supported in Safari not IE9 and below
Topics
CSS
columns - shorthand for column-count, column-gap etc.
column-width - set the width (units) for all the children
-ms-grid-columns: auto | unit e.g. 200px 1fr 2fr | none
-ms-grid-rows: auto | min-content | max-content
display: flex
flex-wrap: wrap, nowrap, wrap-reverse
flex-basis - the size, for the children in units or keywords: fill, max-content, fit-content
Topics
XML
handling xml
methods of doc
xmlDoc.selectSingleNode(‘news/channel/item/title’)
xmlNode.textContent
xmlNode.text
XHR with older Microsoft browsers uses:
new ActiveXObject(‘microsoft.XMLHTTP’);
Checking for success:
readyState === 4
status === 200
Topics
Event bubbling and capturing
var target = event.target || event.srcElement
event.target is for standards compliant browsers
event.srcElement is for Windows browsers
addEventListener with last argument true is only the way to catch the event at capturing e.g. button.addEventListner(‘click’, myFn, true);
Cancelling
For W3C-compliant browsers use
event.stopPropagation()
For IE<9 use
event.cancelBubble = true
Topics - Gotchas
SVG Microsoft use the currentScale attribute which accepts a number
The test may include deprecated (Microsoft only) properties such as:
- event.returnValue
- attachevent.el(eventnamewithOn)
$(‘form’).serialize() - uses the name attributes of the inputs (not the ID)
creates a (serial) string
CSS exclusions, which are only supported in Microsoft browsers
ms-wrap-flow: auto | both | start | end | maximum | clear
Drag and drop
microsoft flex: flex-align, flex-pack etc.
Topics
Style sheet order
- user agent declarations (the default styles your browser applies to elements)
- user normal declarations (a user's own stylesheet if they're using one)
- author normal declarations (this is your normal stylesheet)
- author important declarations (anything your mark important)
- user important declarations (any important styles from the user's stylesheet)
Topics
Microsoft software
Visual Studio Professional 2012
Visual Studio Premium 2012
Visual Studio Ultimate 2012
Visual Studio Express 2012 for Web
Microsoft Blend - a design app