Download
1 / 37
370 likes | 507 Views
advanced Javascript. Operators. == Test for equality === Test for identity != and !=== N umbers , strings, and boolean values are compared by value Objects, arrays, and functions are compared by reference. Variables.
E N D
Operators • == Test for equality • === Test for identity • != and !=== • Numbers, strings, and boolean values are compared by value • Objects, arrays, and functions are compared by reference
Variables • No Block Scope. All variables declared in a function, no matter where they are declared, are defined throughout the function • Undefined Versus Unassigned
Call Object If global variables are properties of the special global object, then what are local variables? They too are properties of an object. This object is known as the call object. The call object has a shorter lifespan than the global object, but it serves the same purpose. While the body of a function is executing, the function arguments and local variables are stored as properties of this call object. The use of an entirely separate object for local variables is what allows JavaScript to keep local variables from overwriting the value of global variables with the same name.
Call Object The var statement defines each named variable by creating a property with that name either in the call object of the enclosing function or, if the declaration does not appear within a function body, in the global object.
JavaScript Execution Contexts Every JavaScript function runs in its own unique execution context with its own call object in which local variables are defined
Variables as Properties • Variables in JavaScript are fundamentally the same as object properties • You can use the JavaScript keyword this to refer to the global object. Within functions, this has a different use • In client-side JavaScript, the Window object serves as the global object for all JavaScript code contained in the browser window it represents
Funciton An important feature of JavaScript is that functions are values that can be manipulated by JavaScript code. In many languages, including Java, functions are only a syntactic feature of the language: they can be defined and invoked, but they are not data types. The fact that functions are true values in JavaScript gives a lot of flexibility to the language. It means that functions can be stored in variables, arrays, and objects, and it means that functions can be passed as arguments to other functions.
for … in … • The for/in loop does not actually loop through all possible properties of all objects. In the same way that some object properties are flagged to be read-only or permanent (nondeletable), certain properties are flagged to be nonenumerable. These properties are not enumerated by the for/in loop. While all user-defined properties are enumerated, many built-in properties, including all built-in methods, are not enumerated. Objects can inherit properties from other objects. Inherited properties that are user-defined are also enumerated by the for/in loop.
function • Since JavaScript is a loosely typed language, you are not expected to specify a datatype for function parameters, and JavaScript does not check whether you have passed the type of data that the function expects. If the datatype of an argument is important, you can test it yourself with the typeof operator. JavaScript does not check whether you have passed the correct number of arguments either. If you pass more arguments than the function expects, the function ignores the extra argumetns. If you pass fewer than expected, the parameters you omit are given the undefined value. Some functions are written to tolerate omitted arguments, and others behave incorrectly if you don't pass all the arguments they expect.
Function Call Operator The ( ) operator is used to invoke functions in JavaScript. This is an unusual operator because it does not have a fixed number of operands. The first operand is always the name of a function or an expression that refers to a function. It is followed by the left parenthesis and any number of additional operands, which may be arbitrary expressions, each separated from the next with a comma. The right parenthesis follows the final operand. The ( ) operator evaluates each of its operands and then invokes the function specified by the first operand, with the values of the remaining operands passed as arguments.
Nested Function Function definitions usually appear in top-level JavaScript code. They may also be nested within other function definitions, but only at the "top level" of those functionsthat is, function definitions may not appear within if statements, while loops, or any other statements. Note that this restriction applies only to functions defined with the function statement. Function literal expressions, which are described in the next section, may appear anywhere.
function the function statement is not a statement. Statements cause dynamic behavior in a JavaScript program, while function definitions describe the static structure of a program. Statements are executed at runtime, but functions are defined when JavaScript code is parsed, or compiled, before it is actually run. When the JavaScript parser encounters a function definition, it parses and stores (without executing) the statements that comprise the body of the function. Then it defines a property (in the call object if the function definition is nested in another function; otherwise, in the global object) with the same name as the function to hold the function.
function • Although function literals create unnamed functions, the syntax allows a function name to be optionally specified, which is useful when writing recursive functions that call themselves var f = function fact(x) { if (x <= 1) return 1; else return x*fact(x-1); };
function • When the JavaScript parser encounters a function definition, it parses and stores (without executing) the statements that comprise the body of the function. Then it defines a property (in the call object if the function definition is nested in another function; otherwise, in the global object) with the same name as the function to hold the function.
return • If a function executes a return statement with no expression, or if it returns because it reaches the end of the function body, the value of the function-call expression is undefined.
Closure What’s the output? function foo( ) { var x = 10; return function bar( ) { console.log(x); } } var x=5; varbarReference=foo(); barReference(); The answer is 10
Closure • A closure is a function that is evaluated in an environment containing one or more bound variables. When called, the function can access these variables. The explicit use of closures is associated with functional programming
Closure • In some languages, a closure may occur when a function is defined within another function, and the inner function refers to local variables of the outer function. At runtime, when the outer function executes, a closure is formed, consisting of the inner function’s code and references to any variables of the outer function required by the closure
Closure • A closure can be used to associate a function with a set of "private" variables, which persist over several invocations of the function. The scope of the variable encompasses only the closed-over function, so it cannot be accessed from other program code. However, the variable is of indefinite extent, so a value established in one invocation remains available in the next. As a consequence, closures can be used to hide state, and thus to implement object-oriented programming.
Context Context
Anonymous function Why //Variable i is undefined. for (var i=0; i < 10; i++) { //do some stuff with i } console.log(i); // ??? Reason A subtle but important characteristic of JavaScript is that it does not support the concept of blocked scope outside of functions, and for this reason, the values of i and any other “temporary” variables defined during iteration, conditional logic, etc., live on long after the block executes.
Lexical Scoping • Functions in JavaScript are lexically rather than dynamically scoped. This means that they run in the scope in which they are defined, not the scope from which they are executed. When a function is defined, the current scope chain is saved and becomes part of the internal state of the function. At the top level, the scope chain simply consists of the global object, and lexical scoping is not particularly relevant. When you define a nested function, however, the scope chain includes the containing function. This means that nested functions can access all of the arguments and local variables of the containing function.
Object An object literal is a comma-separated list of property name/value pairs, enclosed within curly braces. var empty = {}; // An object with no properties var point = { x:0, y:0 }; var circle = { x:point.x, y:point.y+1, radius:2 }; The Object() constructor creates an empty object, just as the literal {} does
Object • the for/in loop does not enumerate properties in any specific order, and although it enumerates all user-defined properties, it does not enumerate certain predefined properties or methods.
Object • Objects in JavaScript can serve as associative arrays; that is, they can associate arbitrary data values with arbitrary strings. When an object is used in this way, a different syntax is generally required to access the object's properties: a string containing the name of the desired property is enclosed within square brackets.
Object • Objects as Associative Arrays • object.property • object["property"]
Object • constructor Property • toString() Method • toLocaleString() Method • valueOf() Method • hasOwnProperty() Method • propertyIsEnumerable() Method • isPrototypeOf() Method
Object constructor Every object has a constructor property that refers to the constructor function that initializes the object
this • The way context works is through the this variable. The this variable will always refer to the object that the code is currently inside of
global • global objects are actually properties of the window object
prototype • an object prototype is just an object, you can attach new properties to them, just like any other object.
Resources • http://www.ibm.com/developerworks/cn/linux/l-cn-closure/index.html
