JavaScript Primer Basic Introduction of JavaScript JavaScript - PowerPoint PPT Presentation

JavaScript Primer Basic Introduction of JavaScript

JavaScript History • Why (re)introduce JavaScript? Notorious for being world’s most misunderstood programming language o (Douglas Crockford - http://javascript.crockford.com/javascript.html) Scripting language of the World Wide Web o A very nice dynamic object-oriented general purpose programming o language Java- prefix suggests that JavaScript is somehow related to Java o ECMAScript 3 – first stable version of JavaScript standard (1999) and has o remained stable ever since. We will use ECMAScript 5 (2009) and not ECMAScript 6 (June, 2015) o Unlike most programming languages, the JavaScript language has no o concept of input or output. Browser is most common host environment o JavaScript interpreters found elsewhere – Adobe Acrobat, Photoshop, o SVG images, Yahoo’s widget engine, server-side environments as Node.js

JavaScript Overview Lisp in C’s clothing • C-like syntax, including curly braces and clunky for statement makes it look like o an ordinary procedural language JavaScript has more in common with functional languages like Lisp and o Scheme: It has arrays instead of lists, and objects instead of property lists, BUT o Functions are first class objects; it has closures; You get lambdas without having o to balance all those parens Object-Oriented • It has objects which can contain data and methods that act upon that data o Objects can contain other objects o It does not have classes, but it does have constructors which do what classes o do It does not have class-oriented inheritance, but it does have prototype- o oriented inheritance. Private members: - http://www.crockford.com/javascript/private.html o

Brief Overview • Language with Types, operators, standard built-in objects, and methods o Building blocks of the language: the types o JavaScript programs manipulate values, which belong to a type o q Number q String q Boolean q Object ( Function, Array, Date, RegExp) q null q undefined

Numbers • Numbers in JavaScript are double-precision 64-bit format IEEE 754 values • No such thing as integer in JavaScript • Arithmetic operators are supported. • Built-in object called Math, provides advanced mathematical functionality • parseInt() and parseFloat() functions convert from string to integer or floating point, respectively • NaN, isNaN(), isFinite() are available

String • Strings in JavaScript are sequences of Unicode characters Each character is represented by a 16-bit number o String is a primitive type in JavaScript o Strings are immutable and are passed by value. o Strings have length property o Strings can be used like objects—they have methods that allow you to o manipulate the string and access information about the string. List of string methods: http://www.w3schools.com/jsref/jsref_obj_string.asp o > var str = new String(”new string"); > str; > str.newProperty = ”new property value”; > str;

Boolean Type • JavaScript has a boolean type—possible values are true and false . true and false are both keywords o Any value can be converted to a boolean according to these rules: o • false, 0, empty string (“”), NaN, null, undefined all become false or falsy • All other values become true or truthy Boolean operations such as && (logical and ), || (logical or ), o and ! (logical not ) are supported. • Comparisons Comparisons in JavaScript can be made using <, >, <= and >=. o These work for both strings and numbers. 123 == "123"; // true o Does type coercion 1 == true; // true o 123 === "123"; // false o Avoids type 1 === true; // false o coercion

Control Structures • if (condition 1){ … } else if (condition 2) { … } else { … } statements as in languages with C-like syntax • while(condition){ … } loops as in • do{ … }while(condition) loops • for (init; condition; increment){ … } loops • && and || use short circuit evaluation • switch statement for numbers and strings

Objects • JavaScript objects can be thought of as simple collections of name-value pairs. As such, they are similar to: o • Dictionaries in Python. • Hashes in Perl and Ruby. • Hash tables in C and C++. • HashMaps in Java. • Associative arrays in PHP. The "name" part is a JavaScript string, while the value can be any o JavaScript value — including more objects. Creating Objects o var obj1 = new Object(); // create an empty object with new operator var obj 2= {}; // use object literal notation

Object Prototype • An object from which other objects inherit their properties and methods • All built-in JavaScript objects inherit from the Object.prototype • Standard way to create an object prototype is to use an object constructor function function Person(name, age) { this.name = name; this.age = age; } // Define an object var You = new Person("You", 24); // We are creating a new person named "You" // (that was the first parameter, and the age..)

Resources https://developer.mozilla.org/en- • US/docs/Web/JavaScript/A_re-introduction_to_JavaScript http://javascript.crockford.com/javascript.html) • http://www.crockford.com/javascript/private.html • http://javascript.crockford.com/inheritance.html • http://www.w3schools.com/jsref/jsref_obj_string.asp • http://www.w3schools.com/js/js_object_prototypes.asp •