Javascript - Revision history

Andre at 16:17, 6 April 2018

2018-04-06T16:17:11Z

← Older revision		Revision as of 16:17, 6 April 2018
Line 21:		Line 21:

	https://mdn.mozillademos.org/files/13506/boxes.png		https://mdn.mozillademos.org/files/13506/boxes.png
	<ref>"Storing the information you need — Variables." MDN Web Docs, 28 Mar. 2018, developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables.</ref>		<ref>"Storing the information you need — Variables." MDN Web Docs, 28 Mar. 2018, http://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Variables.</ref>


Line 64:		Line 64:

	Links of JS functions: <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref> <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>		Links of JS functions: <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref> <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>
	~~<ref>"Javascript functions." Culttt, 6 Apr. 2018, www.culttt.com/2012/10/08/javascript-functions.</ref>~~
	~~=Learning Resources=~~

	=Exercise=		=Exercise=
Line 80:		Line 78:
	When you are done FORK and SAVE		When you are done FORK and SAVE

	~~= References =~~

	* [https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/A_first_splash Mozilla's A first splash]
	* [https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_went_wrong Mozilla's What went wrong? Troubleshooting JavaScript]

			=Learning Resources=

			* "A first splash into JavaScript." MDN Web Docs,http://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/A_first_splash.
			* "Javascript functions." Culttt, http://www.culttt.com/2012/10/08/javascript-functions.
			* Lynda.com [https://www.lynda.com/JavaScript-tutorials/JavaScript-Essential-Training/574716-2.html Javascript Essential Training]:
			** 2 The Basics
			** 3 Working with data
			** 4 Functions and objects


			= References =
	<references/>		<references/>

Andre at 16:00, 6 April 2018

2018-04-06T16:00:42Z

← Older revision		Revision as of 16:00, 6 April 2018
Line 64:		Line 64:

	Links of JS functions: <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref> <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>		Links of JS functions: <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref> <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>
			<ref>"Javascript functions." Culttt, 6 Apr. 2018, www.culttt.com/2012/10/08/javascript-functions.</ref>
	=Learning Resources=		=Learning Resources=

Andre: /* Functions */

2018-04-06T12:48:33Z

Functions

← Older revision		Revision as of 12:48, 6 April 2018
Line 57:		Line 57:
	'''Values can be ''passed'' to a function''', and the '''function will ''return'' a value'''.		'''Values can be ''passed'' to a function''', and the '''function will ''return'' a value'''.

	[[File:~~js_functions~~.png]]		[[File:Js_functions.png]]

	[https://codepen.io/PublicationStation/pen/NYOoqq Codepen Functions1: Example and exercise]		[https://codepen.io/PublicationStation/pen/NYOoqq Codepen Functions1: Example and exercise]
Line 63:		Line 63:
	[https://codepen.io/PublicationStation/pen/geBZKZ? Codepen Functions2: Example and exercise]		[https://codepen.io/PublicationStation/pen/geBZKZ? Codepen Functions2: Example and exercise]

	<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref>		Links of JS functions: <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref> <ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>
	<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>

	=Learning Resources=		=Learning Resources=

Andre: /* Functions */

2018-04-06T12:46:33Z

Functions

← Older revision		Revision as of 12:46, 6 April 2018
Line 51:		Line 51:
	Like the program itself, a function is composed of a sequence of statements or steps called the ''function body''.		Like the program itself, a function is composed of a sequence of statements or steps called the ''function body''.

	When the function is ''called'' it performs its sequence of steps~~. It can be very useful to perform sequences of steps that need to be ''run'' more than once in your program~~.		When the function is ''called'' it performs its sequence of steps.

	Values can be ''passed'' to a function, and the function will ''return'' a value.		It can be very useful to perform sequences of steps that need to be ''run'' more than once in your program.

			'''Values can be ''passed'' to a function''', and the '''function will ''return'' a value'''.

			[[File:js_functions.png]]

			[https://codepen.io/PublicationStation/pen/NYOoqq Codepen Functions1: Example and exercise]

			[https://codepen.io/PublicationStation/pen/geBZKZ? Codepen Functions2: Example and exercise]

	<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref>		<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref>
	<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>		<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>

			=Learning Resources=

	=Exercise=		=Exercise=

Andre at 13:50, 5 April 2018

2018-04-05T13:50:26Z

← Older revision		Revision as of 13:50, 5 April 2018
Line 45:		Line 45:
	** <code>var saturn = {"moons": ["Pan", "Daphnis", " Atlas", "Prometheus", "Pandora"], "Volume":"95.159 Earths"}</code>		** <code>var saturn = {"moons": ["Pan", "Daphnis", " Atlas", "Prometheus", "Pandora"], "Volume":"95.159 Earths"}</code>


			=Functions=
			A function is a "subprogram" that can be ''called'' by code external to it.

			Like the program itself, a function is composed of a sequence of statements or steps called the ''function body''.

			When the function is ''called'' it performs its sequence of steps. It can be very useful to perform sequences of steps that need to be ''run'' more than once in your program.

			Values can be ''passed'' to a function, and the function will ''return'' a value.

			<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions.</ref>
			<ref>"Functions." MDN Web Docs, 5 Apr. 2018, http://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions.</ref>

	=Exercise=		=Exercise=

Andre: /* Exercise */

2018-04-05T13:42:49Z

Exercise

← Older revision		Revision as of 13:42, 5 April 2018
Line 47:		Line 47:

	=Exercise=		=Exercise=
	https://codepen.io/PublicationStation/pen/QmVRdp~~?editors=1011~~		https://codepen.io/PublicationStation/pen/QmVRdp

			Based on original https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Silly_story_generator

			The code for this generator is incomplete. You must make it work, by:
			* replacing <nowiki>Y</nowiki> by one random element of the <nowiki>insertY</nowiki> array
			* replacing <nowiki>Z</nowiki> by one random element of the <nowiki>insertZ</nowiki> array

			* ensuring that if NO "custom name" is given, Bob is the character who sees "the whole thing" (you will need to use if conditions)

			When you are done FORK and SAVE

	= References =		= References =

Andre: /* Exercise */

2018-04-05T13:41:37Z

Exercise

← Older revision		Revision as of 13:41, 5 April 2018
Line 47:		Line 47:

	=Exercise=		=Exercise=
	~~Notes from Andre to self:~~		https://codepen.io/PublicationStation/pen/QmVRdp?editors=1011
	~~Based on~~ https://~~developer~~.~~mozilla.org/en-US/docs/Learn~~/~~JavaScript~~/~~First_steps~~/~~Silly_story_generator~~
	~~Write basic page structure with form~~

	= References =		= References =

Andre: /* What is JavaScript? */

2018-04-05T12:09:15Z

What is JavaScript?

← Older revision		Revision as of 12:09, 5 April 2018
Line 10:		Line 10:

	= What is JavaScript? =		= What is JavaScript? =
			JavaScript is a scripting or programming language that allows you to implement complex things on web pages — every time a web page does more than just sit there and display static information for you to look at — displaying timely content updates, interactive maps, animated 2D/3D graphics, scrolling video jukeboxes, etc. — you can bet that JavaScript is probably involved.<ref>"What is JavaScript?" MDN Web Docs, 28 Mar. 2018, https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript.</ref>
	~~<blockquote>~~

	JavaScript is a scripting or programming language that allows you to implement complex things on web pages — every time a web page does more than just sit there and display static information for you to look at — displaying timely content updates, interactive maps, animated 2D/3D graphics, scrolling video jukeboxes, etc. — you can bet that JavaScript is probably involved.<ref>"What is JavaScript?" MDN Web Docs, 28 Mar. 2018, https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/What_is_JavaScript.</ref~~> </blockque~~>

	= Variables =		= Variables =

Andre at 18:31, 1 April 2018

2018-04-01T18:31:08Z

← Older revision		Revision as of 18:31, 1 April 2018
Line 47:		Line 47:
	* Object: is a list of items, each item, stored by a name-value pair. The values can be strings, numbers, lists or even other objects.		* Object: is a list of items, each item, stored by a name-value pair. The values can be strings, numbers, lists or even other objects.
	** <code>var saturn = {"moons": ["Pan", "Daphnis", " Atlas", "Prometheus", "Pandora"], "Volume":"95.159 Earths"}</code>		** <code>var saturn = {"moons": ["Pan", "Daphnis", " Atlas", "Prometheus", "Pandora"], "Volume":"95.159 Earths"}</code>


			=Exercise=
			Notes from Andre to self:
			Based on https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Silly_story_generator
			Write basic page structure with form

	= References =		= References =

Andre: /* Data types */

2018-04-01T18:29:15Z

Data types

← Older revision		Revision as of 18:29, 1 April 2018
Line 36:		Line 36:

	=Data types =		=Data types =
			'''Code pen exampled: https://codepen.io/PublicationStation/pen/wmjXLR'''


	JS features a few data types, or in other words different types of content, which can be used as values of a variable. These include:		JS features a few data types, or in other words different types of content, which can be used as values of a variable. These include:
	* strings: pieces of text, always wrapped in single or double quotation marks <code>var name = "I am Pluto";</code>		* [https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Strings strings]: pieces of text, always wrapped in single or double quotation marks <code>var name = "I am Pluto";</code>
	* numbers (both integers and float point numbers) <code>var discovered = 1930;</code>		* [https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Math numbers] (both integers and float point numbers) <code>var discovered = 1930;</code>
	* booleans: true or false values (outside quotation mais) <code>var planet = false; var dwarf=true;</code>		* booleans: true or false values (outside quotation mais) <code>var planet = false; var dwarf=true;</code>
	* Arrays (or lists): a container of multiple values enclosed in square brackets and separated by commas <code>var planets=["Pluto", "Neptune", "Uranus", "Saturn"]</code>		* [https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Arrays Arrays] (or lists): a container of multiple values enclosed in square brackets and separated by commas <code>var planets=["Pluto", "Neptune", "Uranus", "Saturn"]</code>
	** the values of arrays can be accessed by their location within the array var <code>p=planets[0]; var s=planets[3]</code>		** the values of arrays can be accessed by their location within the array var <code>p=planets[0]; var s=planets[3]</code>
	* Object: is a list of items, each item, stored by a name-value pair. The values can be strings, numbers, lists or even other objects.		* Object: is a list of items, each item, stored by a name-value pair. The values can be strings, numbers, lists or even other objects.
	** <code>var saturn = {"moons": ["Pan", "Daphnis", " Atlas", "Prometheus", "Pandora"], "Volume":"95.159 Earths"}</code>		** <code>var saturn = {"moons": ["Pan", "Daphnis", " Atlas", "Prometheus", "Pandora"], "Volume":"95.159 Earths"}</code>


	= References =		= References =