JavaScript Primer Basic Introduction of JavaScript JavaScript History • Why (re)introduce JavaScript? o Notorious for being world’s most misunderstood programming language (Douglas Crockford - http://javascript.crockford.com/javascript.html) o Scripting language of the World Wide Web o A very nice dynamic object-oriented general purpose programming language o Java- prefix suggests that JavaScript is somehow related to Java o ECMAScript 3 – first stable version of JavaScript standard (1999) and has remained stable ever since. o We will use ECMAScript 5 (2009) and not ECMAScript 6 (June, 2015) o Unlike most programming languages, the JavaScript language has no concept of input or output. o Browser is most common host environment o JavaScript interpreters found elsewhere – Adobe Acrobat, Photoshop, SVG images, Yahoo’s widget engine, server-side environments as Node.js JavaScript Overview • Lisp in C’s clothing o C-like syntax, including curly braces and clunky for statement makes it look like an ordinary procedural language o JavaScript has more in common with functional languages like Lisp and Scheme: o 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 to balance all those parens • Object-Oriented o 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 do o It does not have class-oriented inheritance, but it does have prototype- oriented inheritance. o Private members: - http://www.crockford.com/javascript/private.html Brief Overview • Language with o 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 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 o 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 manipulate the string and access information about the string. o List of string methods: http://www.w3schools.com/jsref/jsref_obj_string.asp > 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. o true and false are both keywords o Any value can be converted to a boolean according to these rules: • false, 0, empty string (“”), NaN, null, undefined all become false or falsy • All other values become true or truthy o Boolean operations such as && (logical and), || (logical or), and ! (logical not) are supported. • Comparisons o Comparisons in JavaScript can be made using <, >, <= and >=. These work for both strings and numbers. o 123 == "123"; // true o 1 == true; // true Does type coercion 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. o As such, they are similar to: • Dictionaries in Python. • Hashes in Perl and Ruby. • Hash tables in C and C++. • HashMaps in Java. • Associative arrays in PHP. o The "name" part is a JavaScript string, while the value can be any JavaScript value — including more objects. o Creating Objects 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.