JavaScript uses a fixed number of bits, namely 64 of them, to store a single number value. There are only so many patterns you can make with 64 bits, which means that the amount of different numbers that can be represented is limited. For N decimal digits, the amount of numbers that can be represented is 10N. Similarly, given 64 binary digits, you can represent 264 different numbers, which is about 18 quintillion (an 18 with 18 zeros after it). This is a lot.
There is one more arithmetic operator, which you might not immediately recognize. The % symbol is used to represent the remainder operation. X % Y is the remainder of dividing X by Y. For example, 314 % 100 produces 14, and 144 % 12 gives 0. Remainder’s precedence is the same as that of multiplication and division. You’ll often see this operator referred to as modulo, though technically remainder is more accurate.
To make it possible to include such characters in a string, the following notation is used: whenever a backslash (\) is found inside quoted text, it indicates that the character after it has a special meaning. This is called escaping the character. A quote that is preceded by a backslash will not end the string but be part of it. When an n character occurs after a backslash, it is interpreted as a newline. Similarly, a t after a backslash means a tab character. Take the following string:
"This is the first line\nAnd this is the second"
The actual text contained is this:
This is the first line
And this is the second
There are, of course, situations where you want a backslash in a string to be just a backslash, not a special code. If two backslashes follow each other, they will collapse together, and only one will be left in the resulting string value. This is how the string “A newline character is written like "\n".” can be expressed:
"A newline character is written like \"\\n\"."
Strings cannot be divided, multiplied, or subtracted, but the + operator can be used on them. It does not add, but it concatenates—it glues two strings together. The following line will produce the string "concatenate":
"con" + "cat" + "e" + "nate"
There are more ways of manipulating strings, which we will discuss when we get to methods in Chapter 4.
Not all operators are symbols. Some are written as words. One example is the typeof operator, which produces a string value naming the type of the value you give it.
console.log(typeof 4.5)
// → number
console.log(typeof "x")
// → string
We will use console.log in example code to indicate that we want to see the result of evaluating something. When you run such code, the value produced should be shown on the screen, though how it appears will depend on the JavaScript environment you use to run it.
The other operators we saw all operated on two values, but typeof takes only one. Operators that use two values are called binary operators, while those that take one are called unary operators. The minus operator can be used both as a binary operator and as a unary operator.
console.log(- (10 - 2))
// → -8
NaN is supposed to denote the result of a nonsensical computation, and as such, it isn’t equal to the result of any other nonsensical computations.
console.log(true && false)
// → false
console.log(true && true)
// → true
The || operator denotes logical or. It produces true if either of the values given to it is true.
console.log(false || true)
// → true
console.log(false || false)
// → false
The last logical operator I will discuss is not unary, not binary, but ternary, operating on three values. It is written with a question mark and a colon, like this:
console.log(true ? 1 : 2);
// → 1
console.log(false ? 1 : 2);
// → 2
This one is called the conditional operator (or sometimes just ternary operator since it is the only such operator in the language). The value on the left of the question mark “picks” which of the other two values will come out. When it is true, the middle value is chosen, and when it is false, the value on the right comes out.
console.log(8 * null)
// → 0
console.log("5" - 1)
// → 4
console.log("5" + 1)
// → 51
console.log("five" * 2)
// → NaN
console.log(false == 0)
// → true
The || operator, for example, will return the value to its left when that can be converted to true and will return the value on its right otherwise. This conversion works as you’d expect for Boolean values and should do something analogous for values of other types.
console.log(null || "user")
// → user
console.log("Karl" || "user")
// → Karl
Variable names can be any word that isn’t a reserved word (such as var). They may not include spaces. Digits can also be part of variable names—catch22 is a valid name, for example—but the name must not start with a digit. A variable name cannot include punctuation, except for the characters $ and _.
A single var statement may define multiple variables. The definitions must be separated by commas.
var one = 1, two = 2;
console.log(one + two);
// → 3
to calculate 2-10(1024)
var result = 1;
var counter = 0;
while (counter < 10) {
result = result * 2;
counter = counter + 1;
}
console.log(result);
// → 1024
Executing a function is called invoking, calling, or applying it. You can call a function by putting parentheses after an expression that produces a function value. Usually you’ll directly use the name of the variable that holds the function. The values between the parentheses are given to the program inside the function. In the example, the alert function uses the string that we give it as the text to show in the dialog box. Values given to functions are called arguments. The alert function needs only one of them, but other functions might need a different number or different types of arguments.
The do loop is a control structure similar to the while loop. It differs only on one point: a do loop always executes its body at least once, and it starts testing whether it should stop only after that first execution. To reflect this, the test appears after the body of the loop:
do {
var yourName = prompt("Who are you?");
} while (!yourName);
console.log(yourName);
This program will force you to enter a name. It will ask again and again until it gets something that is not an empty string. Applying the ! operator will convert a value to Boolean type before negating it, and all strings except "" convert to true. This means the loop continues going round until you provide a name that is not the empty string.
Note that even though no block is opened with a {, the statement in the loop is still indented two spaces to make it clear that it “belongs” to the line before it.
----------- I did it! -----------
-
All variables that have been created and set are truthy (and will evaluate to true if they are the condition of a control flow statement) unless they contain one of the seven values listed below:
false
0 and -0
"" and '' (empty strings)
null
undefined
NaN (Not a Number)
document.all (something you will rarely encounter)
JavaScript function syntaxt / structure
variable DeclairName = (paremeter)=> { }; vs function DeclairName(parameter){ }
const takeOrder= ()=> {
console.log('Order: pizza');
};
takeOrder();
> Order: pizza
const takeOrder= (topping)=> {
console.log('Order: pizza topped with ' + topping);
};
takeOrder('meat');
> Order: pizza topped with meat
The variable is then set equal = to a set of parentheses followed by an arrow token () =>, indicating the variable stores a function. This syntax is known as arrow function syntax.
arrow function syntax : Arrow function syntax is a shorter syntax for a function expression. You can identify arrow functions through the use of parentheses and the arrow token () =>
Finally, between the curly braces {} is the function body, or the JavaScript statements that define the function. This is followed by a semi-colon ;. In JavaScript, any code between curly braces is also known as a block.
14. Optimizing the Internet for one purpose de-optimizes it for all others.
19. The Net is not a medium any more than a conversation is a medium.
21. Unlike a medium, you and I leave our fingerprints, and sometimes bite marks, on the messages we pass. We tell people why we’re sending it. We argue with it. We add a joke. We chop off the part we don’t like. We make these messages our own.
22. Every time we move a message through the Net, it carries a little bit of ourselves with it.
37. Hatred is present on the Net because it’s present in the world, but the Net makes it easier to express and to hear.
38. The solution: If we had a solution, we wouldn’t be bothering you with all these damn clues.
39. We can say this much: Hatred didn’t call the Net into being, but it is holding the Net — and us — back.
41. Viewed coldly the Net is just technology. But it’s populated by creatures who are warm with what they care about: their lives, their friends, the world we share.
42. The Net offers us a common place where we can be who we are, with others who delight in our differences.
46. We do this in part because conversation requires a common ground: shared language, interests, norms, understandings. Without those, it’s hard or even impossible to have a conversation.
48. On the Internet, the distance between tribes starts at zero.
51. Being welcoming: There’s a value the Net needs to learn from the best of our real world cultures.
57. Every time you call us “consumers” we feel like cows looking up the word “meat.”
61. When personalizing something is creepy, it’s a pretty good indication that you don’t understand what it means to be a person.
62. Personal is human. Personalized isn’t.
70. Web pages are about connecting. Apps are about control.
77. Non-neutral applications built on top of the neutral Net are becoming as inescapable as the pull of a black hole.
78. If Facebook is your experience of the Net, then you’ve strapped on goggles from a company with a fiduciary responsibility to keep you from ever taking the goggles off.
81. But they benefit from the gravity of sociality: The “network effect” is that thing where lots of people use something because lots of people use it.
82. Where there aren’t competitive alternatives, we need to be hypervigilant to remind these Titans of the Valley of the webby values that first inspired them.
85. If we want our government to back off, the deal has to be that if — when — the next attack comes, we can’t complain that they should have surveilled us harder.
91. We can only figure out what it means to be private once we figure out what it means to be social. And we’ve barely begun to re-invent that.
107. We have a culture that defaults to sharing and laws that default to copyright. Copyright has its place, but when in doubt, open it up.
112. Sure, apps offer a nice experience. But the Web is about links that constantly reach out, connecting us without end. For lives and ideas, completion is death. Choose life.
Terms in JavaScript
Syntax :
Parameter Parameters are variables in a function definition that represent data we can input into the function.
argument arguments are provided when you call a function, and parameters receive arguments as their value.
When we set the value 9 as the argument, we pass a value to the function.
Parentheses curved bracelets
var vs let / const
Tag a tag is used for creating an element, which consists of the name of an HTML element in angle brackets.
(i.e. <p> for paragraph.)
Element An element is a part of a webpage. A typical element includes an opening tag with some attributes, enclosed text
content, and a closing tag. (i.e. <h1 class="news"> Heading </h1>)
Attribute An attribute extends a tag, changing its behavior or providing metadata. An attribute always has the form
name=value, such as defining the link location (<a href="index.html">Link</a>), setting the image path (<img src="path-to-image/image.png" />) or adding a class <h1 class="news"> Heading </h1>.
Two basic activities emerge. A person may work “on” the digital or “within” it. In the former, one’s attention is directed from the outside in, taking the medium itself as its object, while in the latter one takes the perspective of the medium itself, radiating attention outward to other contexts and environments. To generalize from this, the first position (working “on”) is labeled modern or, when applied to art and aesthetics, modernist. And the latter position (working “within”) is labeled non-modern, be it premodern, postmodern, or some other alternative.
New technologies, emphatically including the Internet, are dramatically increasing people's ability to hear echoes of their own voices and to wall themselves off from others.
Will the anarcho-libertarian roots of the internet kick back at the cloud's centralized architecture—or are they forever overrun by it? Has the cloud assumed its final form, or is there still a time and a place for surprises?
In the popular discourse, authoritarianism typically stands as liberal capitalism’s dramatic antithesis. And nowhere are their purported differences more stark than in their attitudes toward individual privacy. While in the liberal capitalist world every person’s home is said to be their castle, in authoritarian regimes, it is just one more state-monitored cage.
Capitalism’s detractors have long decried its tendency to hollow out the commons and push everyone into their private bubbles, but its supporters celebrate this atomization.
In the digital age, this relationship has become all the more fractious. A new form of capitalism has emerged on the Internet, variously referred to as informational capitalism, digital capitalism, or surveillance capitalism.
Corporations strive for perfect transparency, so that, in the words of Google’s chief economist, Hal Varian, the search engine will “know what you want and tell it to you before you ask the question.”
But dangers do exist. Although much of the data that tech firms collect is frivolous, we should be wary of the aggregation effect: taken individually, each piece seems innocuous; taken together, an intimate picture of our person is revealed. (...) The greatest threat lies not so much in what corporations know as in how they use that knowledge. The services they offer are entrancing, replete with conveniences and new possibilities, tailored to our every need. (...) Knowledge may mean power, but information often means domination.
This new incarnation of surveillance synthesizes Orwell’s dystopia with Aldous Huxley’s Brave New World. In Orwell’s creation, an authoritarian surveillance state maintains order; in Huxley’s, the self-medication of soma, an antidepressant drug that keeps everyone smiling, does the same work. Today, surveillance is carried out less by a Big Brother as by a set of Best Friends: these services remember our birthdays, answer our questions without casting judgment, and suggest films and books we might like. Far from being based on fear, the new surveillance system is fun, caring, and helpful. When Facebook crashed in some US cities during summer 2014, many Americans called 911.
Tech CEOs celebrate today as “the most measured age in history,” equating gathering information with the Enlightenment ideal of knowledge-discovery.
Under big-data capitalism, the privacy of the individual is subsumed within an ideology of profit-linked progress. Where liberalism held that restricting freedom of expression is a “peculiar evil, one that is robbing the human race,” informational capitalism updates this: the refusal to share personal information robs the human race. To keep some aspects of yourself private now stands in the way of progress.
As privacy scholar Julie Cohen notes, informational capitalism ultimately wishes to “produce tractable, predictable citizen-consumers whose preferred modes of self-determination play out along predictable and profit-generating trajectories.”
Coupled with the increasing importance of the Internet as a site for human development, its pervasive influence cannot be healthy for a diverse, democratic society.
Below the surface of the machine, the program moves. Without effort, it expands and contracts. In great harmony, electrons scatter and regroup. The forms on the monitor are but ripples on the water. The essence stays invisibly below.
This is a list of terms and commands you need to know to use your terminal for interfacing with programs on your computer, git version control, and github.
Key Terms
Shell - The shell is a command line interface for running programs on your computer.
Terminal - The program we use to interact with the shell is called a terminal program. If you are on Mac or Linux, you already have a good one of these. If you are on Windows you can download a shell and terminal program that works as well as the one on Linux. Windows does have a command shell, however it runs on the old MSDOS program rather than a Unix heritage.
Command Prompt - The prompt your terminal displays when waiting for your command. Usually looks like: Your-User-Name-Computer:~ Working_Directory$
Directory - Another name for folder.
Working Directory - The folder your terminal is currently pointing to.
PATH - The series of steps you took to get to a particular directory or file. A PATH lists the directories you stepped into to get to a file or folder, and separates each step with a forward slash. Ex. Users/BobbyJoe/Documents/Code/WinterSession2018/index.html
GIT Version Control - A Version Control System is just software that helps you control (or manage) different versions of something (typically source code). Git is a local (meaning stored on your computer) form of version control that we run via our computer's terminal. The main point of a version control system is to help you maintain a detailed history of the project as well as the ability to wok on different versions of it. Having a detailed history of a project is important because it lets you see the progress of the project over time. If needed, you can also jump back to any point in the project to recover the data or files. It’s like clicking the undo button in a word document, except git version control is substantially more powerful. Git also gives you the ability to:
label a change
give a detailed explanation of why a change was made
move between different versions of the same document
undo change A, make edit B, then get back change A without affecting edit B
GitHub GitHub is an online (remote) repository for storing files and commits for a project. It's like the google drive, where you can save files online, create and edit documents, work on a document simultaneously with people working on other computers, and give access to other people to read or modify certain files or folders. Git does the same thing, but with code, and it saves the history of revisions to files and folders.
Commit - Git thinks of its data like a set of snapshots of a mini filesystem. Every time you commit(save the state of your project in Git), it basically takes a picture of what all your files look like at that moment and stores a reference to that snapshot. You can think of it as a save point in a game - it saves your project's files and any information about them. Everything you do in Git is to help you make commits, so a commit is the fundamental unit in Git.
Repository/Repo - A repository is a directory which contains your project work, as well as a few files (hidden by default on Mac OS X) which are used to communicate with Git. Repositories can exist either locally on your computer or as a remote copy on another computer. A repository is made up of commits.
Working Directory (When Referring to GIT) - The Working Directory is the files that you see in your computer’s file system. When you open your project files up on a code editor, you’re working with files in the Working Directory. This is in contrast to the files that have been saved (in commits!) in the repository. When working with Git, the Working Directory is also different from the command line’s concept of the current working directory which is the directory that your shell is “looking at” right now.
Staging Area/Staging Index/Index - A file in the Git directory that stores information about what will go into your next commit. You can think of the staging area as a prep table where Git will take the next commit. Files on the Staging Index are poised to be added to the repository.
Checkout - A checkout is when content in the repository has been copied to the Working Directory.
Branch - A branch is when a new line of development is created that diverges from the main line of development. This alternative line of development can continue without altering the main line. You can think of a branch as where you make a save point in a video game and then decide to try out a risky move in the game. If the risky move doesn't pan out, then you can just go back to the save point. The key thing that makes branches incredibly powerful is that you can make save points on one branch, and then switch to a different branch and make save points there, too.
SHA - A SHA is basically an ID number for each commit. Here’s what a commit’s SHA might look like: e2adf8ae3e2e4ed40add75cc44cf9d0a869afeb6\. It is a 40-character string composed of characters (0-9 and a-f) and calculated based on the contents of a file or directory structure in Git. “SHA” is shorthand for “Secure Hash Algorithm”.
BASH Commands for Interfacing with Your Computer Via the Terminal
These are the commands you will use inside your terminal to navigate to your project folders, create directories and files, move them, edit them, rename them, or remove them. Type these commands into your terminal to perform the action. Do not include the <> marks in your commands, they are there to signify a variable (referred to as argument) where you will need to include specific information.
pwd - Print Working Directory. Prints the PATH to the Working Directory (the directory your terminal is currently pointing to).
pwd
ls - List. Lists the names of all of the visible files and folder in the working directory
ls
ls -a is a modifier to the ls command that will list all of the visible and hidden files and directories in the working directory. cd - Change Directory. Allows you to move into a different directory. Include the PATH to the directory you would like to move into.
cd<folderName>
mv - Move. Allows you to move files or folders into a different directory. Include the PATH to the files and directories you would like to move, and the PATH to the directory you would like to move them into.
mv can also be used to rename a file or folder by having the first variable be the current name of the file and the second variable be the name you want to change it to. mv <currentFileName> <newFileName>
There are special names for folders that can be used with terminal commands like cdormv... stands for parent directory,. stands for working directory, / stands for root folder, ~stands for home directory.
mkdir - Make Directory. This command creates a new folder in the working directory.
mkdir <nameOfDirectory>
touch - Create a new file. This command creates a new file in the working directory.
touch <nameOfFile>
rm - Remove. This command can be used to delete a file or folder.
rm <nameOfFile>
To delete an entire folder you will need to use the command rm -r <folderName>
GIT Version Control
Git version control allows you to save versions of your coding projects on your local computer. Just like with a document you're working on in illustrator or Microsoft Office, you should save your work often. With Git version control, not only will you save your work, but you will keep a record of the changes you have made.
Set Up
To set up git version control for a project follow this process:
Navigate to/Create Project Directory - In your terminal, navigate to the root directory (the folder containing all of your project files and folder) of your project. If you're starting a new project and have not created a folder yet for your project, you can create one with the command mkdir <folderName>. OR you can create a root project folder AND initialize a git repo (step 2) by typing the command git init <folderName>. This tells the computer to create a folder with the name you gave it and initialize a git repository inside of it. If you set up your root project folder and initialized a git repository by using git init <folderName>then you can skip step 2.
Initialize Git Repository - Initialize a git repository by entering the command
git init
into your terminal. This will set up a git repository inside of your root project directory. It is important to set up the git repository only inside of the root directory otherwise it wont keep track of all of your files. The git repository is hidden inside of your finder widow, so you will need to use the command ls -a to be able to see it. The git repository will appear as a .git directory. Do not change any of the files inside of the .git directory.
Committing Versions of your Code to Your Git Repository
A git repository is now set up in your root project folder. Any changes you make to files or directories inside of your project folder will be tracked by git. You can now begin working on your project. As you work on your project you will need to save significant changes to your work to git, like creating a header, adding images, changing a font or background color. Any working changes that alter the look or functionality of your project. In git, this is called making commits to the repository — you are saving snapshots of your project to the git repository that you can later refer back to. Anytime you are ready to make a commit to your repository follow this process:
Save Files - Hit save on any project files to which you made changes.
Check Git Status - First you want to see what changes if any have been made. You can ask git what changes inside of your root project directory have been made by typing the command:
git status
Git will give you a response. If git doesn't see any changes made to the folder since the last commit that was made, you will receive the response:
$ git status
On branch master
Your branch is up-to-date with 'origin/master'.
nothing to commit, working tree clean
Git is telling you that your working directory (in the git sense) is in line with the last commit you made. If there are some changes that haven't been been committed yet, you'll get a response that lists all of the modified files and directories that need to be staged for a commit:
Changes not staged for commit:
(use "git add <file>..." to update what will be committed)
(use "git checkout -- <file>..." to discard changes in working directory)
modified: <fileName>
no changes added to commit (use "git add" and/or "git commit -a")
In the response, git is telling you which files need to be staged for a commit and the command you need to run to do it. 3. Stage Modified Files for Commit - In order to create a commit, you need to add the files you want to commit to the "staging area". This tells git which modified files you want git to track as part of the commit. You can do this with the command:
git add <nameOfFile1><nameOfFile2>
You can use the response from git status as a reference for the names of each modified file that needs to be staged for a commit. If there are a number of files that need to be staged for commit, instead of typing out each name, you can inlude them all with the command git add -A. This tells git to stage all of the modified files in the working directory. You can then run git status again to be check that all of the files you wanted were moved from the working directory to the staging area. 4. Commit Modified Files to Repo - Now that you have the modified files staged for commit, all that's left is to commit them to the repository and leave a note about what changes were made. You can do this with the command:
git commit -m "Message"
The commit message should be written in parenthesis, and best practice is to have the commit message be written in present tense such as "Add Hero Image to Homepage" or "Change background color to black". Once you commit the changed files, git will respond with a message that tells you the SHA for the commit, the message, and how many files changed, along with the number of insertions and deletions in code that were made between this commit and the last one. 5. Push to Remote Repository - If you have a remote github repository established, you can now push the commit you made to your local repository to the remote repository with the command:
git push origin master
This will only work if you already connected your remote repository. If you have not, go through the instructions in the next section to set up a remote repository and connect it. 6. Make More Changes and Repeat - That's all there is to it! You just saved a version of your code to your repository. You can now make more changes, and repeat the steps of adding and committing those changes to the repository.
Remote Version Control with GitHub
The git version control process commits versions of your code to a git repository on your computer. If you want to make your code and git repository available to other computers, you will need to establish a connection to a remote repository on hosted on the web, and sync your local repository to the remote repository. The remote repository we are using in class is appropriately namegithub. The following steps will show you how to set up a connection to your github account and push your local commits to a remote repository using your command terminal.
Set Up
Create New GitHub Repository - Got to github.com and sign into your account. In the nav bar in the top right corner you will see a plus sign with a dropdown menu arrow next to it. Click on the dropdown and select the "New repository" option. This will begin the process for creating a remote repository.
Fill In Information - Selecting "New repository" will bring you to a page where you can set up your github repo. All you need to do on this page is name your repository. Check to make sure your repository is set to public, and that "Initialize this repository with a README" is NOT selected. You also do not need to add a .gitignore file or a license, so both of those options can be left on the default setting of "None". Click the button "Create repository," and there you have it! You've now created a remote repository on github. All you have left to do is establish a connection between your local repository and the remote repository you just created.
Connect Local and Remote Repositories - Once you select "Create repository" github will bring you to page of instructions on how to push your local repository up to the remote repository you just created. You will see a url that github generated as an address for your remote repository. Copy that url for use in your terminal. Go to your terminal and navigate into your root project folder containing your local git repository. Once in the root folder type the command:
git remote add origin <urlOfRemoteGitRepository>
This adds a remote git repository to the url you provided with the name "origin". You could actually name your remote repository anything you wanted by swapping out the word origin with the name your prefer, but it is common practice to just use the name "origin". 4. Push Local Repository to Remote Repository - Now that you've established a connection to your remote repository, you can push all of your code and commit history to that remote repo with the command:
git push -u origin master
This line of code pushes your code and commit history in your local repository to origin. The modifier -u tells git to remember to push to this remote repository in the future. You only need to run the commands in steps 3 and 4 once when setting up the connection between your remote and local repositories. After that you can push your code and commit history with the just one command git push origin master.
