Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

2015 JavaScript introduction

742 views

Published on

An introduction to JavaScript (for .NET developers)

Published in: Technology
  • Login to see the comments

  • Be the first to like this

2015 JavaScript introduction

  1. 1. danielfisher.com JavaScript Introduction Daniel Fisher | info@danielfisher.com
  2. 2. danielfisher.com Daniel Fisher I design, develop, deploy, teach, train, coach and speak software. • danielfisher.com • HTML5 & Web • Data Access & Performance • Scalable & Testable Design • Distributed Systems & Services • Security & Trust • justcommunity.de • NRWConf.de • lennybacon.com • Blog • @lennybacon • Tweets
  3. 3. danielfisher.com EFFICIENT COMMUNICATION…
  4. 4. danielfisher.com Agenda • History • Usage • Language
  5. 5. danielfisher.com Introduction • Developed by Brendan Eich at Netscape in 1994. – A lightweight interpreted language – Considered client-server solution as a distributed OS – Complement Java by appealing to nonprofessional programmers • Like Microsoft's VB.
  6. 6. danielfisher.com The Language • JavaScript is a prototype-based scripting language that is: – Dynamic – Weakly typed – And has first-class functions. • It is a multi-paradigm language, supporting multiple programming styles: – Object-oriented – Imperative – Functional
  7. 7. danielfisher.com Adoption by Microsoft • Internet Explorer 3.0 introduced JavaScript in 1996. • Internet Information Server 3.0, introduced support for server-side JavaScript in 1996. – Microsoft's JavaScript implementation was later renamed JScript to avoid trademark issues. – JScript added new date methods to fix the Y2K- problematic methods in JavaScript, which were based on Java's java.util.Date class.
  8. 8. danielfisher.com Server side JavaScript • Netscape introduced an implementation of the language for server-side scripting with Netscape Enterprise Server in 1995. – Since the mid-2000s, there has been a proliferation of server-side JavaScript implementations. • node.js (2009)is one recent notable example of server-side JavaScript being used in real-world applications.
  9. 9. danielfisher.com Standardization • In November 1996, Netscape announced that it had submitted JavaScript to Ecma International for consideration as an industry standard – Subsequent work resulted in the standardized version named ECMAScript.
  10. 10. danielfisher.com Trademark • Today, "JavaScript" is a trademark of Oracle Corporation.
  11. 11. danielfisher.com USAGE
  12. 12. danielfisher.com Using Script <script language="text/javascipt"></script> <script language="text/javascipt" src="myExternalScript.js"> </script> <a href="#" onclick="alert('you clicked me');"> click me </a>
  13. 13. danielfisher.com LANGUAGE
  14. 14. danielfisher.com Primitive Types • null • Object • Bool • Number • String • Array
  15. 15. danielfisher.com Complex Types • Date • Math
  16. 16. danielfisher.com Global Objects • undefined • NaN • window • document • navigator
  17. 17. danielfisher.com Operators +, -, *, /, %, ++, --, … ==, ===, !=, !===, <, >, <=, >= &&, ||, ! if, if-else, while, do, …
  18. 18. danielfisher.com Variables • Untyped! • Can be declared with var keyword: var foo; • Can be created automatically by assigning a value: foo = 1; blah = "Hi Dave"; 18
  19. 19. danielfisher.com Browser UI Interaction var yourName = prompt('What is your name?'); if(confirm('Are you sure?')){ alert('Hello ' + yourName); };
  20. 20. danielfisher.com String var y = "Hello World"; var len = y.length.toString(); var part = y.substring(0, 2); var char = y.charAt(0); var upper = y.toUpperCase(); var lower = y.toLowerCase();
  21. 21. danielfisher.com Math Math.sqrt() Math.pow() Math.abs() Math.max() Math.min() Math.floor() Math.ceil() Math.round() Math.PI() Math.E() Math.random()
  22. 22. danielfisher.com Date var today = new Date(); // sets to current date & time newYear = new Date(2002, 0, 1); newYear.getYear() newYear.getMonth() newYear.getDay() newYear.getHours() newYear.getMinutes() newYear.getSeconds() newYear.getMilliseconds()
  23. 23. danielfisher.com The Document object • Represents the currently loaded document Attributes of the current document are: – Title – Referrer – URL – Images – Forms – Links – Colors 23
  24. 24. danielfisher.com Document Methods • The documents methods include: document.write() Like a print statement – the output goes into the HTML document. document.writeln() Adds a newline after printing. document.write( "My title is " + document.title ); 24
  25. 25. danielfisher.com The Navigator Object • Represents the browser. Read-only! • Attributes include: – appName – appVersion – platform EIW: Javascript the Language 25
  26. 26. danielfisher.com The Window object • Methods include: – alert() – confirm() – prompt() – moveTo() – moveBy() – open() – scroll() – scrollTo() – resizeBy() – resizeTo() – close() 26
  27. 27. danielfisher.com The Window Methods • Represents the current window. • Attributes are: – document – name – status – parent 27
  28. 28. danielfisher.com Comments //Single line comment /* A Multi Line Comment */
  29. 29. danielfisher.com Arrays var a1 = []; var a2 = [1, 2, 4]; a2.push(5); var x = a2.pop(); var y = a2[0];
  30. 30. danielfisher.com Arrays var a3, i, j; a3 = [1, 2, 4]; for (i=0; i<a3.length; i++) { a3[i]=i; } for (j in a3) { document.writeln(j); }
  31. 31. danielfisher.com Javascript Functions • The keyword function is used to define a function (subroutine): function add(x, y) { return (x + y); } • No type is specified for arguments! 31
  32. 32. danielfisher.com Functional Programming function filter(pred, arr) { var len = arr.length; var filtered = []; for(var i = 0; i < len; i++) { var val = arr[i]; if(pred(val)) { filtered.push(val); } } return filtered; } var numbersGreaterThan100 = filter( function(x) { return (x > 100) ? true : false; }, [12, 200, 42, 11] ); alert(numbersGreaterThan100);
  33. 33. danielfisher.com BOOK DANIELFISHER.COM READ LENNYBACON.COM FOLLOW @LENNYBACON LINK LINKEDIN.COM/IN/LENNYBACON XING XING.COM/PROFILE/DANIEL_FISHER FRIEND FB.COM/DANIEL.FISHER.LENNYBACON MAIL DANIEL.FISHER@LENNYBACON.COM SKYPE LENNYBACON CALL +49 (176) 6159 8612

×