;===== ; CS 111 - Week 2 Lecture 1 - 2026-09-01 ; ; In-class examples, cleaned up after class! ; ; last modified: 2026-09-01 ;----- ; require is an odd operation! ; ; require expects the name of a Racket module, and returns NOTHING, ; but has the SIDE-EFFECT of making that module's definitions ; and functions available in the current Definitions window/file! ; ; so, this compound expression makes available the functions and definitions ; in the module 2htdp/image (the image module/library created to ; work with the 2nd edition of the text "How to Design Programs") (require 2htdp/image) ;===== ; reminder: compound expression syntax: ; ; (operation arg-expr1 arg-expr2 ...) ; ; BUT: a compound expression's argument expressions ; but be of the data type(s) expected, in the ; order expected, for that operation ;----- ; and the argument expressions in a compound expression ; can be simple or compound, as long as they are of ; the type expected by that compound expression's ; operation ;----- ; operator + expects 2 or more argument expressions of ; type number, ; so any argument expressions whose type is number ; are fine (+ 1 3) (+ (- 4 3) (* 1.5 2)) ;===== ; CS 111 class style: put a blank line after ; a comment/block of comments (+ 3 5) ;===== ; more examples of compound expressions ;===== ; circle expects a radius in pixels, "solid" or "outline", ; and a color, and returns an image of a circle ; of that size, style, and color (circle 100 "outline" "purple") ;===== ; rectangle expects a width and height in pixels, ; "solid" or "outline", and a color, and returns ; an image of a rectangle of that size, style, ; and color (rectangle 200 150 "outline" "pink") ;===== ; CS 111 class style: write a long compound expression ; over more than one line, INDENTING the arguments ; on the next lines by at least 3 spaces ;===== ; overlay expects two or more image expressions ; and returns an image with the given images ; atop each other ; each of the following IS following CS 111 class style: (overlay (circle 100 "outline" "purple") (star 30 "solid" "teal") (rectangle 200 150 "outline" "pink")) (overlay (circle 100 "outline" "purple") (star 30 "solid" "teal") (rectangle 200 150 "outline" "pink")) (overlay (circle 100 "outline" "purple") (star 30 "solid" "teal") (rectangle 200 150 "outline" "pink")) ;===== ; to describe functions, we will use the ; following CLASS-style standard versions ; of: ; * a function signature comment ; * a purpose statement comment ; ; (NOTE: our CLASS STYLE for these is STRICTER than that in ; the course text or Racket documentation...! ; * BELOW is the style you are expected to use in CS 111 ; course assignments and exams. ;===== ; CS 111 style: when you design a new function, ; you should write a function signature comment for it ; ; a function signature is a comment that includes: ; * the function's name ; * the data type of each of its expected arguments ; * the data type of the value it returns ; ; signature: funct-name: arg-type arg-type ... -> return-type ; ; really, this gives the syntax for properly using this ; function in a compound expression! ;----- ; example of a function signature comment for one of the ; 2htdp/image module functions; ; signature: image-height: image -> number ; NOTE: remember to use data types in function signatures (image-height (circle 30 "solid" "gray")) ;===== ; consider the function signature for 2htdp/image function ; rectangle: ; ; signature: rectangle: number number string color -> image ; ; do you see that, for rectangle, ; you NEED more information, ; in addition to the function signature, ; to be able to know how to reasonably use it? ;===== ; CS 111 style: when you design a new function, ; you should ALSO write a function purpose statement ; comment for it ; ; a purpose statement is a comment that basically ; provides the SEMANTICS/meaning of this function -- ; ; a purpose statement is a comment that DESCRIBES what ; the function expects and DESCRIBES what it returns ; (and also describes any side-effects it has), ; formatted as follows: ; ; purpose: expects [DESCRIBE what it expects] ; and returns [DESCRIBE what it returns] ; ; NOTE: class style is to explicitly SAY ; expects ... and returns ... ; NOTE: these are expected to be DESCRIPTIVE -- don't just repeat ; the signature! ; ; (again, this CS 111 class style for this is MORE strict ; than in course text) ;----- ; for example, let's add a purpose statement comment ; along with each of the function signatures given earlier ; (typically, we will write a function's signature and purpose statement ; comments smushed together like this) ;----- ; signature: image-height: image -> number ; purpose: expects an image, and returns its height in pixels (image-height (circle 30 "solid" "gray")) ;----- ; signature: rectangle: number number string color -> image ; purpose: expects a width and height in pixels, either "solid" ; or "outline", and a color, and returns ; a rectangular image of that width, height, style, and color (rectangle 100 30 "solid" "blue") ;----- ; fun fact: the BSL Racket type color can be a string containing ; a known color name, or the result of a function such as make-color ; that returns a color! ;----- ; signature: make-color: number number number -> color ; purpose: expects a red value, green value, and blue value, ; each in [0, 255], and returns a color with that RGB value (square 65 "solid" (make-color 223 255 0)) ;===== ; some functions can can give a version of a value ; in a different type ; ; For example -- what if you would like an image version ; of some string? ;----- ; signature: text: string number string -> image ; purpose: expects a string, a desired font-size in pixels, and ; a color, and returns an image of text in that ; font-size and color (text "moo" 50 "green") ;===== ; Write a compound expression whose value ; will be an image of a black rectangle outline ; whose width is 1.25 times the width ; of an image of the text HEY! LOOKY! in teal, ; 48-pixel-high letters within it, ; and whose height is twice the height of ; that text. (overlay (rectangle (* 1.25 (image-width (text "HEY! LOOKY!" 48 "teal"))) (* 2 (image-height (text "HEY! LOOKY!" 48 "teal"))) "outline" "black") (text "HEY! LOOKY!" 48 "teal")) ;===== ; Gee, wouldn't it be nice to be able to give a ; name to a particular value, such as ; (text "HEY! LOOKY!" 48 "teal") above, ; and use that name in the above expression instead? ;===== ; Programming languages provide means for a programmer ; to give names they choose to various things. ; ; an IDENTIFIER is a name the programmer chooses. ; ; Some kinds of identifiers include: ; * a named constant, a name given to an unchanging value ; * a function, a name given to an operation ; * a parameter variable, a name given to a value of ; a future argument ; (and there are a few more...) ;===== ; BSL Racket identifier syntax: ; ; a consecutive collection of characters that: ; * are not "special": ()[]{}",';#|\ ; * do not include blank or newline ; * do not meet the syntax rules of another ; Racket data type ;----- ; common STYLE (and CS 111 class style) ; make identifiers MEANINGFUL and NON-misleading ; ; and typically start with a letter...! ;===== ; BSL Racket syntax to create a new identifier depends ; on the kind of identifier! ;===== ; for a named constant, ; a name a programmer chooses to give ; a constant, unchanging value: ; ; (define DESIRED-CONST desired-expr) ; ; and this returns nothing (!!) and has the side-effect ; of now making DESIRED-CONST a simple expression ; whose value is the value of desired-expr ;===== ; CS 111 class style: ; * write named constants in ALL-UPPERCASE ; * give them descriptive, meaningful, non-misleading names (define LOOKY-IMG (text "HEY! LOOKY!" 48 "teal")) ;----- ; now LOOKY-IMG is a simple expression of type image! ; And it can be used anywhere an image expression can ; be used! LOOKY-IMG (overlay (rectangle (* 1.25 (image-width LOOKY-IMG)) (* 2 (image-height LOOKY-IMG)) "outline" "black") LOOKY-IMG)