Click to add Text Javascript Presented by Bunlong VAN Basic.

Slides:



Advertisements
Similar presentations
The JavaScript Programming Language
Advertisements

JavaScript: A Language of Many Contrasts
JavaScript I. JavaScript is an object oriented programming language used to add interactivity to web pages. Different from Java, even though bears some.
the javascript language BY SA.
Save this in an.html file. function log(arg) { document.writeln(arg); } function identity(x) { return x; } log(identity(3));
Intro to JavaScript. JavaScript History Client (generally browser-side) language invented at Netscape under the name LiveScript around 1995 Netscape wanted.
Variables, Environments and Closures. Overview We will Touch on the notions of variable extent and scope Introduce the notions of lexical scope and.
CERTIFICATION OBJECTIVES Use Class Members Develop Wrapper Code & Autoboxing Code Determine the Effects of Passing Variables into Methods Recognize when.
The Web Warrior Guide to Web Design Technologies
Julian on JavaScript: Objects Julian M Bucknall, CTO.
Advanced JS The World's Most Misunderstood Programming Language ) Douglas Crockford( Shimon Dahan
Javascript II Expressions and Data Types. 2 JavaScript Review programs executed by the web browser programs embedded in a web page using the script element.
JavaScript, Third Edition
Subroutines. aka: user-defined functions, methods, procdures, sub-procedures, etc etc etc We’ll just say Subroutines. –“Functions” generally means built-in.
JAVASCRIPT Introduction Kenny Lam. What is Javascript?  Client-side scripting language that can manipulate elements in the DOM  Event-driven language.
Taking JavaScript Seriously IS NOT THE WORST IDEA.
CSE 341 Lecture 24 JavaScript arrays and objects slides created by Marty Stepp
Eric Vogel Software Developer A.J. Boggs & Company.
Arrays – What is it? – Creation – Changing the contents Functions – What is it? – Syntax – How they work – Anonymous functions A quick lesson in Objects.
Prof. Alfred J Bird, Ph.D., NBCT Office – McCormack 3rd floor 607.
Week 9 PHP Cookies and Session Introduction to JavaScript.
Chapter 3: Data Types and Operators JavaScript - Introductory.
Introduction to JavaScript Gordon Tian
CS212: Object Oriented Analysis and Design Lecture 6: Friends, Constructor and destructors.
Using Client-Side Scripts to Enhance Web Applications 1.
C Derived Languages C is the base upon which many build C++ conventions also influence others *SmallTalk is where most OOP comes Java and Javascript have.
Hello.java Program Output 1 public class Hello { 2 public static void main( String [] args ) 3 { 4 System.out.println( “Hello!" ); 5 } // end method main.
JavaScript Syntax and Semantics. Slide 2 Lecture Overview Core JavaScript Syntax (I will not review every nuance of the language)
Functions Reusable Parts of Code SoftUni Team Technical Trainers Software University
Martin Kruliš by Martin Kruliš (v1.0)1.
4.4 JavaScript (JS) Deitel Ch. 7, 8, 9, JavaScript & Java: Similarities JS (JavaScript) is case-sensitive Operators –arithmetic: unary +, unary.
Functions and Closures. JavaScript Closures Are Everywhere In JS we often want to say “when this thing happens, do something” event driven programming.
JavaScript Scripting language What is Scripting ? A scripting language, script language, or extension language is a programming language.
Project 1: Using Arrays and Manipulating Strings Essentials for Design JavaScript Level Two Michael Brooks.
Prototypal Inheritance. Can We Do Inheritance Without Classes? How do we share behaviour across objects.
Function the Ultimate Act III. Function Method Class Constructor Module.
Julian on JavaScript: Functions Julian M Bucknall, CTO.
Constructors & Garbage Collection Ch. 9 – Head First Java.
JavaScript: The First Parts Part Three Douglas Crockford Yahoo! Inc.
CSE 341 Lecture 25 More about JavaScript functions slides created by Marty Stepp
JavaScript: The First Parts Part One Douglas Crockford Yahoo! Inc.
CNIT 133 Interactive Web Pags – JavaScript and AJAX Objects.
Unit 10-JavaScript Functions Instructor: Brent Presley.
Rich Internet Applications 2. Core JavaScript. The importance of JavaScript Many choices open to the developer for server-side Can choose server technology.
JavaScript Functions. CSS Inheritance Which formatting applies? x y z input { display: block; } input.pref { background:red; } If you have a selector.
JavaScript for C# developers Dhananjay Microsoft MVP
Scheme in Scheme 2. What’s next  Adding set!  Dynamic vs. lexical variable scope  Extending mcscheme v1 with libraries  Can mcscheme execute mcscheme?
MIT-AITI: Functions Defining and Invoking Functions Functions as Data Function Scope: The call Object Function Arguments: The arguments objects Function.
Intro to PHP More About PHP. So far we've covered... Web Servers & Protocols Presentation Layer (static pages) For the rest of the semester... Application.
Getting from Scripts to Applications Donald J. Sipe | Refresh Jacksonville | November 11 th 2008.
JavaScript and Ajax (JavaScript Arrays) Week 5 Web site:
Expressions and Data Types Professor Robin Burke.
Lambda Functions & Closures A Sydney PHP Group Presentation 2 nd October 2008 By Timothy Chandler.
Chapter 4 Client-Side Programming: the JavaScript Language
JAVASCRIPT INTERVIEW QUESTIONS & ANSWERS.
Modern JavaScript Develop And Design
Scope, Objects, Strings, Numbers
JavaScript Fundamentals
JavaScript Syntax and Semantics
JavaScript and Ajax (Expression and Operators)
Objectives Create an array Work with array properties and methods
ARRAYS MIT-AITI Copyright 2001.
Lecture III.
PHP.
CS5220 Advanced Topics in Web Programming JavaScript Basics
University of Kurdistan
CS5220 Advanced Topics in Web Programming Node.js Basics
CS3220 Web and Internet Programming JavaScript Basics
CS3220 Web and Internet Programming JavaScript Basics
Presentation transcript:

Click to add Text Javascript Presented by Bunlong VAN Basic

The Disclaimer

Data Types ObjectObject FunctionFunction NumberNumber StringsStrings BooleansBooleans Null – a values isn't anythingNull – a values isn't anything Underfined – default value for variables and parameters, value of missing members in the object etc.Underfined – default value for variables and parameters, value of missing members in the object etc.

typeof Prefix Operator The typeof prefix operator returns a string identifying the type of valueThe typeof prefix operator returns a string identifying the type of value Use instanceof insteadUse instanceof instead typeof(true); // “boolean” [] instanceof Array; // true

Object Objects can contain data and methodsObjects can contain data and methods Objects can inherit from other objectsObjects can inherit from other objects An object contain an unordered collection of name/value pairsAn object contain an unordered collection of name/value pairs Values can be any type including other objectsValues can be any type including other objects JSONJSON

Object Literals Object are wrapped in {}Object are wrapped in {} Names can be stringNames can be string Value can be an expressionValue can be an expression ; used for separation; used for separation, separate pairs, separate pairs var myObject = { name: “Javascript”, “data”: { foo: 10, bar: 20 } } var name = myObject.name; var foo = myObject.data.foo;

Array Array inherits from Object (like every other object in JavaScript)Array inherits from Object (like every other object in JavaScript) No need to provide length when creating a new oneNo need to provide length when creating a new one Unlike object they have a length member and is always 1 larger than the highest subscriptUnlike object they have a length member and is always 1 larger than the highest subscript concat, join (can also be used for concatenating multiple strings), pop, push, slice, sort, splice

Array (Con.) value.constructor === Array Use construction Use construction value instanceof Array Use instanceof Use instanceof [].constructor === Array; // true [] instanceof Array; // true

Function They are first class ObjectsThey are first class Objects Can be passed, stored and returned just like any valueCan be passed, stored and returned just like any value Inherit from ObjectInherit from Object Function can appear anywhere an expression can appearFunction can appear anywhere an expression can appear

Closure (Function Con.) function sayHello(name) { var text = 'Hello ' + name; var text = 'Hello ' + name; var sayAlert = function() { alert(text); }; var sayAlert = function() { alert(text); }; return sayAlert; return sayAlert;} var say = sayHello(“Foo”); say(); Function can be contained inside other functionsFunction can be contained inside other functions Inner function has access to the variable and parameters of the function it is contained withinInner function has access to the variable and parameters of the function it is contained within This is static or lexical scopingThis is static or lexical scoping The scope that inner function has access to continues even after the parent function has returned is called ClosureThe scope that inner function has access to continues even after the parent function has returned is called Closure

Function (Con.) Function inside an object is called a methodFunction inside an object is called a method When invoked with too many arguments, the rest are ignoredWhen invoked with too many arguments, the rest are ignored When invoked with fewer arguments, the rest are set to undefinedWhen invoked with fewer arguments, the rest are set to undefined var showMe = function(foo, bar) { return foo + bar; } showMe(“foo”, “bar”, “foobar”); // 3rd argument will be ignored showMe(“foo”); // bar will be undefined

Function (Con.) When a function is invoked in method format, this refers to the object containing it.When a function is invoked in method format, this refers to the object containing it. var foo = { baz: 10, bar: function() { console.log(this.baz);}};foo.bar();

Function (Con.) When object is invoked in function, this refers to the global object.When object is invoked in function, this refers to the global object. var globalVariable = 5; function test() { console.log(this.globalVariable);}test

Function (Con.) When new function is used (implicit return is optional), then this returns the new object createdWhen new function is used (implicit return is optional), then this returns the new object created var Test = function(id) { this.something = id; this.foo = function() { console.log(“this is a test: ” + this.something); }} var t = new Test(10), t1 = new Test(11); t1 = new Test(11);t.foo();t1.foo();

Function (Con.) When function is invoked, in addition to its parameters it has a special parameter called argumentsWhen function is invoked, in addition to its parameters it has a special parameter called arguments Contains all arguments from invocationContains all arguments from invocation Arguments.length will tell you how many arguments were passedArguments.length will tell you how many arguments were passed Arguments is not of type Array evenArguments is not of type Array even Though it has lengthThough it has length var foo = function() { var a = new Array(); console.log(typeof a); console.log(typeof arguments); console.log(arguments instanceof Object); console.log(arguments instanceof Array) }foo();

global object As crockford says, the object that dare not speak of its nameAs crockford says, the object that dare not speak of its name It is the container for all global variables and all built in objectsIt is the container for all global variables and all built in objects On browsers window is the global objectOn browsers window is the global object Variable defined with a var makes it local to the scopeVariable defined with a var makes it local to the scope

global variables are evil Un-namespaced values can clash each others valuesUn-namespaced values can clash each others values Use of it should be minimized or gotten rid of totallyUse of it should be minimized or gotten rid of totally Variables defined in the function / module should start with var otherwise they have a global scopeVariables defined in the function / module should start with var otherwise they have a global scope