Presentation is loading. Please wait.

Presentation is loading. Please wait.

JavaScript Introduction

Similar presentations


Presentation on theme: "JavaScript Introduction"— Presentation transcript:

1 JavaScript Introduction
For CGL 102 專題同學 References: a re-introduction to JavaScript, Speaking JS

2 JavaScript (from Wikipedia)
For your own reading …. JavaScript (from Wikipedia) a high level, dynamic, untyped, and interpreted programming language. Alongside HTML and CSS, it is one of the three essential technologies of World Wide Web content production The syntax of JavaScript is actually derived from C, while the semantics and design are influenced by the Self and Scheme programming languages. JavaScript is also used in environments that are not web-based, such as PDF documents, site-specific browsers, and desktop widgets. On the client side, JavaScript has been traditionally implemented as an interpreted language, but more recent browsers perform just-in- time compilation. It is also used in game development, the creation of desktop and mobile applications, and server-side network programming with runtime environments such as Node.js.

3 For your own reading …. JavaScript Engine The V8 JavaScript Engine is an open source JavaScript engine developed by The Chromium Project for the Google Chrome web browser.  It is written in C++ and is used in Google Chrome, Google's open source browser. It has since seen use in many other projects, such as Node.js and MongoDB. V8 compiles JavaScript to native machine code (IA-32, x86-64, ARM, or MIPS ISAs) before executing it The compiled code is additionally optimized (and re-optimized) dynamically at runtime, based on heuristics of the code's execution profile.

4 Testing Platform Google Chrome JsFiddle
Equivalence of printf() in C/C++ console.log (‘output’); alert (‘output’); Testing Platform Google Chrome JsFiddle

5 REPL (Read-Evaluate-Print Loop)
also known as an interactive toplevel or language shell, is a simple, interactive computer programming environment that takes single expressions, evaluates them, and returns the result to the user a program written in a REPL environment is executed piecewise. The term is most usually used to refer to programming interfaces similar to the classic Lisp machine interactive environment. Common examples include command line shells and similar environments for programming languages, and is particularly characteristic of scripting languages. Repl for JavaScript is available from (1) node.js (2) repl.it

6 Node.js (in ‘git bash’)

7 Repl.it

8 Syntax Overview /* … */ === equal !== not equal

9 Primitive Values vs. Objects
: array, function, object

10 All Values have Properties
Properties can be a method dot operator

11 Properties of Primitive Values
比較內容

12 undefined & null

13 (ref)

14 Object Properties Object: Compared by Reference

15 typeof and instanceof (primitive, object) (object)
All constructors are Capitalized

16 Booleans Values interpreted as false

17 Number IEEE 754 Double-precision (64-bit)
Careful with floating point roundoff errors Integers are represented differently in the 64-bit (ref) For 32-bit number arrays, use Float32Array, Int32Array

18 (Reference) All functions are lower case!

19 Numbers (cont) (Not-a-Number) Two special symbols: NaN, Infinity

20 String Examples + operator

21 Conditionals (if-then-else, switch)

22 Loop (for, while, do-while)

23 Array Array literals Array is also an object Can set/get properties

24 (reference)

25

26 Array Iteration There is no way to stop or break a forEach() loop other than by throwing an exception.  If you need such behavior, use plain for-loop.

27 Array.map (ref)

28 Less Known Facts about Array (ref)
Advanced material… Less Known Facts about Array (ref)

29

30 Associative Array (wiki)

31 Associative Array in JavaScript
In JavaScript, arrays must use numbered indices Represent associative array as objects

32 Function declaration vs. function expression

33 Example: Compute factorial, recursive or iterative
anonymous function: function without a name Named Function expression (ref)

34 Function Parameters (ref)
do not specify data types for parameters. do not perform type checking on the passed arguments. do not check the number of arguments received. Too many arguments: cannot be referred (without names) Missing argument: missing values are set to undefined

35 Function Parameter: the arguments object
Argument Count Check

36 Function Declarations are Hoisted
Therefore, functions can be called before they are declared. Function expressions are NOT hoisted.

37 Related: variable declarations are also hoisted

38 Variable Initializations are NOT Hoisted (ref)
OK! is actually … is the same as … y undefined

39 Best Hoisting Reference (url)
Variable Declarations

40 Function Declarations

41 Variable Scoping Variables are function-scoped

42 Variable Scope (ref) // prints 1-6 Later (IIFE, closure…)

43 Declaring a Variable is Optional?! (ref)
If you use var the variable is declared within the scope you are in (e.g. of the function). If you don't use var, the variable bubbles up through the layers of scope until it encounters a variable by the given name, or the global object (window, if you are doing it in the browser), where it then attaches. It is then very similar to a global variable.

44 Strict Mode (reference)
In strict mode, you cannot … Use a variable (object), without declaring it Delete a variable (object) Use Octal numbers Use reserved words as variable name eval, arguments, public, static, interface, …

45 ‘strict’ mode (reference)

46 JavaScript, the winning style
Other references: w3school JavaScript, the winning style Indentation: TWO spaces, not longer and no tabs quotes: prefer ' over " braces: use open braces on the same line function thisIsBlock { Variable naming: Start first word lowercase and after that all words start with uppercase letter var thisIsTest; Constant naming: all UPPERCASE var CONS = 'PLUS'; Array naming: use plural form var documents = []; Object & Classes:every word’s first letter is capitalized var ThisObject;

47 Error Handling: Throw, Try to Catch

48 Exception Handling


Download ppt "JavaScript Introduction"

Similar presentations


Ads by Google