Java程序辅导

Intro	to	JavaScript
CS	115	Computing	for	the	Socio-Techno	Web
Instructor:	Brian	Brubach
Announcements
• Assignment	3	posted,	due	next	Monday	night
• My	office	hours	2-3pm	today
• Andrea	office	3-6pm	today
• Project	teams
• Please	add	brief	description	of	your	topic	if	you	haven’t	yet
• Meeting	times
• Project	questions?
JavaScript
• JavaScript	à programming	language	that	can	appear	in	html	pages
• Dynamically	create	web	pages
• Control	a	browser	application
• Open	and	create	new	browser	windows
• Download	and	display	contents	of	any	URL
• Interact	with	the	user
• Interact	with	HTML	forms
• Process	values	provided	by	checkbox,	text,	buttons,	etc.
• Example	file	à simple-sqrt-table.js,	
JavaScript	is	not	Java,	but…
• JavaScript	constructs	are	similar	to	Java’s	constructs	(in	many	cases	
identical)
• Example	àMath.sqrt()	in	simple-sqrt-table.html
• JavaScript	can	interact	with	java	programs
JavaScript
• JavaScript	Interpreter	à Process	JavaScript	code
• To	write	JavaScript	programs	you	need…
• A	web	browser
• A	text	editor
• A	JavaScript	program	can	appear…
• In	a	file	by	itself	typically	named	with	the	extension	.js
• In	HTML	files	between		tags
• Client-Side	JavaScript	à the	result	of	embedding	a	JavaScript	interpreter	
in	a	web	browser
• Template	for	JavaScript	Programs	(within	an	HTML	file)
• Example	file	à templateJS.html
Strict	mode
• "use	strict";	à Activates	strict	mode	(include	quotes	and	semicolon)
• Prevents	some	common	mistakes
• Ignore	warning	about	function	form	for	now
• Should	be	first	line	inside	of	the		tags

Execution	of	JavaScript	programs
• Execute	à run	a	program
• JavaScript	interpreter	
• Takes	care	of	processing	JavaScript	code
• HTML	parser	
• Takes	care	of	processing	an	html	document
• Stops	processing	HTML	file	when	JavaScript	code	is	found	(JavaScript	interpreter	
will	then	be	running)
• Computationally	intensive	JavaScript	code	can	cause	a	page	to	load	
slowly
• Example	à simple-sqrt-table.html with	a	number	over	10,000
Some	basic	constructs	for	JavaScipt programs
• String	à Any	set	of	characters	in	double	quotes	(“	”)
• Function/method	
• An	entity	that	completes	a	particular	task	for	us
• Can	take	input	values	and/or	return	output	values
• JS	method	example	àMath.sqrt(x)
• 𝑓 𝑥 = 𝑥
• Input	à 𝑥
• Output	à 𝑥
Output
• Generating	output	with	the	document.writeln(“	”) method
• Add	text	to	the	html	file	by	providing	the	required	text	in	“	”
• Generating	output	with	the	getElementById(’some_id’).innerHTML
method
• Access	HTML	inside	element	with	corresponding	id
• Example	file	à write_html.html
• The	+	allow	us	to	concatenate	strings
• Example	à “Mary”	+	“Land”	becomes	“MaryLand”
• Example	à “Time	is:	“	+	new	Date()
• Examples	in	reading	à
http://cs.wellesley.edu/~cs115/readings/JSProgramming.html
JavaScript	Variables
• Variable	àMemory	location	that	can	store	a	value
• JavaScript	variables	declared	using	var or	let
var temperature;
let area;
• We	prefer	let for	this	course
• Variables	names	must	start	with	a	letter,	underscore,	or	dollar	sign
• Can	be	followed	by	any	number	of	letters,	underscores,	dollar	signs,	or	digits
• Variables	must	be	declared	before	they	are	used
• Part	of	“use	strict”;	requirement
JavaScript	Variables
• A	variable	can	hold	different	type	of	values
• Integer	à 0,	10,	40,	6,	-7
• Floating-point	à 3.2,	.67,	1.48E-20
• String	literals	à “hello”,	“goodbye”	
• Operators
• Assignment	operator	à =
• Typical	arithmetic	operators	à +,	-,	*,	/
• Example:	Variables.html
Reserved	words
• Reserved	words	à words	you	cannot	use	as	identifiers/variables
• Have	meaning	in	the	JavaScript	language
• Some	of	them	are
• break
• do
• if
• catch	
Spaces,	semicolons,	and	comments
• JavaScript	ignores	spaces,	tabs,	and	newlines	between	tokens
• Use	spaces	to	create	nicely	indented	code
• The	rules	are	usually	one	tab	for	indentation	or	three	spaces.
• You	need	to	satisfy	this	requirement	in	programming	assignments
• A	semicolon	is	generally	used	to	mark	the	end	of	a	statement
• Optional	when	a	statement	appears	on	a	separate	line,	the	following	are	
equivalent:
x = 1;
y = 2;
x = 1
y = 2
• In	this	course,	always	use	a	semicolon	to	mark	the	end	of	a	statement
Comments
• Used	to	provide	information	to	the	programmer
• Used	to	identify	sections	in	your	code
• Ignored	by	the	JavaScript	interpreter
• Two	types	of	comments
• Inline	comment						//	This	is	a	comment	until	the	end	of	the	line
• Block	comment	
/*	The	following	is	a	comment
that	spans	several
lines	*/
• Can	also	use	a	block	comment	for	a	single-line	comment
Linking	a	JavaScript	(.js)	file
• 
• Like	having	the	contents	of	the	file	appear	between	the	script	tags