JavaScript Flashcards

1
Q

What are arrays used for?

A

store multi same datas

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
2
Q

Describe array literal notation.

A

array name=[]

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
3
Q

How are arrays different from “plain” objects?

A

array has number index, add items to array we use push

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
4
Q

What number represents the first index of an array?

A

0

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
5
Q

What is the length property of an array?

A

the total number of items in array

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
6
Q

How do you calculate the last index of an array?

A

array.length-1

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
7
Q

What is a function in JavaScript?

A

special object can be called. set of reusable code can be used

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
8
Q

Describe the parts of a function definition.

A

function keyword, function-name, parameter, and {code block, optional return}

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
9
Q

Describe the parts of a function call.

A

()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
10
Q

When comparing them side-by-side, what are the differences between a function call and a function definition?

A

function call will have argument, function definition always will be with code block

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
11
Q

What is the difference between a parameter and an argument?

A

parameter-definition variable

argument-with function call

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
12
Q

Why are function parameters useful?

A

we can have the parameters to create more general data for function to use

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
13
Q

What two effects does a return statement have on the behavior of a function?

A

A return statement ends the execution of a function, and returns control to the calling function.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
14
Q

Why do we log things to the console?

A

console. log specifically is a method for developers to write code to inconspicuously inform the developers what the code is doing. It can be used to alert you that there’s an issue, but shouldn’t take the place of an interactive debugger when it comes time to debug the code.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
15
Q

What is a method?

A

JavaScript methods are the actions that can be performed on objects. A JavaScript method is a property containing a function definition. Property.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
16
Q

How is a method different from any other function?

A

A method, like a function, is a set of instructions that perform a task. The difference is that a method is associated with an object, while a function is not.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
17
Q

How do you remove the last element from an array?

A

.pop()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
18
Q

How do you round a number down to the nearest integer?

A

Math.floor()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
19
Q

How do you generate a random number?

A

Math.random()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
20
Q

How do you delete an element from an array?

A

.splice(index, delect count)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
21
Q

How do you append an element to an array?

A

.push()

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
22
Q

How do you break a string up into an array?

A

.split(‘ ‘) the single space separate words

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
23
Q

Do string methods change the original string? How would you check if you weren’t sure?

A

no change. we can use console log to check

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
24
Q

Roughly how many string methods are there according to the MDN Web docs?

A

a lot…

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
25
Q

Is the return value of a function or method useful in every situation?

A

no…such as splice. sometimes just need to delete

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
26
Q

Roughly how many array methods are there according to the MDN Web docs?

A

36

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
27
Q

What three-letter acronym should you always include in your Google search about a JavaScript method or CSS property?

A

MDN

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
28
Q

Give 6 examples of comparison operators.

A

> ,=,<=

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
29
Q

What data type do comparison expressions evaluate to?

A

boolean

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
30
Q

What is the purpose of an if statement?

A

The if/else statement executes a block of code if a specified condition is true.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
31
Q

Is else required in order to use an if statement?

A

no. its optional

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
32
Q

Describe the syntax (structure) of an if statement.

A

if(keyword) (condition) { code to execute if value is true}

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
33
Q

What are the three logical operators?

A

||,&&,!

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
34
Q

How do you compare two different expressions in the same condition?

A

by using the logical operators

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
35
Q

What are the four components of “the Cascade”.

A

source order,
Inheritance,
Specificity & !important

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
36
Q

What does the term “source order” mean with respect to CSS?

A

Source order is, simply put, the order that your CSS rules are written in your stylesheet. The styling provided for an element last in your stylesheet is the styling that will ultimately take effect.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
37
Q

How is it possible for the styles of an element to be applied to its children as well without an additional CSS rule?

A

inheritance.

but not all properties are inheritable.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
38
Q

List the three selector types in order of increasing specificity.

A

Type, class, and ID selectors.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
39
Q

Why is using !important considered bad practice?

A

because it makes debugging more difficult by breaking the natural cascading in your stylesheets.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
40
Q

Why do we log things to the console?

A

console. log specifically is a method for developers to write code to inconspicuously inform the developers what the code is doing.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
41
Q

What is a “model”?

A

The Document Object Model (DOM) is the data representation of the objects that comprise the structure and content of a document on the web.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
42
Q

Which “document” is being referred to in the phrase Document Object Model?

A

the HTML/web page

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
43
Q

What is the word “object” referring to in the phrase Document Object Model?

A

javascript object

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
44
Q

What is a DOM Tree?

A

In this case, the parent “stem” is the root (html)element, the child “branches” are the nested elements, and the “leaves” are the content within the elements.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
45
Q

Give two examples of document methods that retrieve a single element from the DOM.

A

getElementbyID, querySelector

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
46
Q

Give one example of a document method that retrieves multiple elements from the DOM at once.

A

querySelectorAll

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
47
Q

Why might you want to assign the return value of a DOM query to a variable?

A

so we can reuse the data

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
48
Q

What console method allows you to inspect the properties of a DOM element object?

A

.dir

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
49
Q

Why would a (script) tag need to be placed at the bottom of the HTML content instead of at the top?

A

codes are being run by orders. we have to wait until all variables are assigned

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
50
Q

What does document.querySelector() take as its argument and what does it return?

A

‘the selector’ as argument and returns the first Element within the document that matches the specified selector, or group of selectors.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
51
Q

What does document.querySelectorAll() take as its argument and what does it return?

A

‘the selector’ as argument and returns the nodelists of all elements within the document that matches the specified selector, or group of selectors.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
52
Q

Why do we log things to the console?

A

To verify that the result is what we’re expecting

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
53
Q

What is the purpose of events and event handling?

A

respond user inputs

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
54
Q

Are all possible parameters required to use a JavaScript method or function?

A

No, having a parameter for a function doesn’t mean that it will be used

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
55
Q

What method of element objects lets you set up a function to be called when a specific type of event occurs?

A

addeventlistener

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
56
Q

What is a callback function?

A

function is being called as a variable

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
57
Q

What object is passed into an event listener callback when the event fires?

A

Event object - function as the call back function

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
58
Q

What is the event.target? If you weren’t sure, how would you check? Where could you get more information about it?

A

The target property of the event, a reference to the object onto which the event was dispatched. Check on MDN. The element where our target originated from (not attached)

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
59
Q

What is the difference between these two snippets of code?

A

first one is a variable, second is a function being called

element. addEventListener(‘click’, handleClick)
element. addEventListener(‘click’, handleClick())

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
60
Q

What is the className property of element objects?

A

to update the class attribute

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
61
Q

How do you update the CSS class attribute of an element using JavaScript?

A

by using className

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
62
Q

What is the textContent property of element objects?

A

allow to adjust the text

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
63
Q

How do you update the text within an element using JavaScript?

A

by using elementnode.textcontent=…..

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
64
Q

Is the event parameter of an event listener callback always useful?

A

no

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
65
Q

Would this assignment be simpler or more complicated if we didn’t use a variable to keep track of the number of clicks?

A

it will be more complicated

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
66
Q

Why is storing information about a program in variables better than only storing it in the DOM?

A

We don’t want to have to look elsewhere for the information. Keep the JavaScript data in JavaScript.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
67
Q

What event is fired when a user places their cursor in a form control?

A

focus

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
68
Q

What event is fired when a user’s cursor leaves a form control?

A

blur

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
69
Q

What event is fired as a user changes the value of a form control?

A

input

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
70
Q

What event is fired when a user clicks the “submit” button within a ?

A

submit

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
71
Q

What does the event.preventDefault() method do?

A

prevent the browser from automatically reloading the page with the form’s values in the URL. keep page from refreshing

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
72
Q

What does submitting a form without event.preventDefault() do?

A

data got sent right away, page will refresh

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
73
Q

What property of a form element object contains all of the form’s controls.

A

elements. property

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
74
Q

What property of form a control object gets and sets its value?

A

.value

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
75
Q

What is one risk of writing a lot of code without checking to see if it works so far?

A

break during the middle

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
76
Q

What is an advantage of having your console open when writing a JavaScript program?

A

you can know what’s going on

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
77
Q

Does the document.createElement() method insert a new element into the page?

A

no, not yet. it create the element object

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
78
Q

How do you add an element as a child to another element?

A

by using element.appendChild

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
79
Q

What do you pass as the arguments to the element.setAttribute() method?

A

class(string) and value

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
80
Q

What steps do you need to take in order to insert a new element into the page?

A

query the element from the DOM and use appendChild to add the element object to the DOM element

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
81
Q

What is the textContent property of an element object for?

A

to create its text content

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
82
Q

Name two ways to set the class attribute of a DOM element.

A

by using setAttribute; or using DOMelement.className=’..’

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
83
Q

What are two advantages of defining a function to do create something (like the work of creating a DOM tree)?

A

we can reuse it for more arguments;
ease the process to do in html
same DOM tree in multiple places

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
84
Q

The transition property is shorthand for which four CSS properties?

A

transition-delay,duration,property,timing-function

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
85
Q

What is the event.target?

A

the element triggers the event

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
86
Q

What DOM element property tells you what type of element it is?

A

.tagname

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
87
Q

What is a breakpoint in responsive Web design?

A

the point the view starts to change

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
88
Q

What is the advantage of using a percentage (e.g. 50%) width instead of a fixed (e.g. px) width for a “column” class in a responsive layout?

A

it will change with the parent’s width. so we only need to change the container width

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
89
Q

If you introduce CSS rules for a smaller min-width after the styles for a larger min-width in your style sheet, the CSS rules for the smaller min-width will “win”. Why is that?

A

because of the source order

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
90
Q

What is JSON?

A

JavaScript Object Notation (JSON) is a standard text-based format for representing structured data based on JavaScript object syntax.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
91
Q

What are serialization and deserialization?

A

Serialization is the process of turning an object in memory into a stream of bytes so you can do stuff like store it on disk or send it over the network.

Deserialization is the reverse process: turning a stream of bytes into an object in memory.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
92
Q

Why are serialization and deserialization useful?

A

make it possible to transfer data

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
93
Q

How do you serialize a data structure into a JSON string using JavaScript?

A

JSON.stringify

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
94
Q

How do you deserialize a JSON string into a data structure using JavaScript?

A

JSON.parse

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
95
Q

How to you store data in localStorage?

A

localStroage.setItem

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
96
Q

How to you retrieve data from localStorage?

A

localStroage.getItem

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
97
Q

What data type can localStorage save in the browser?

A

strings

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
98
Q

When does the ‘beforeunload’ event fire on the window object?

A

before reload happened

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
99
Q

What does the transform property do?

A

The transform CSS property lets you rotate, scale, skew, or translate an element. It modifies the coordinate space of the CSS visual formatting model.

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
100
Q

Give four examples of CSS transform functions.

A

scale,rotate, skew, translate

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
101
Q

Give two examples of media features that you can query in an @media rule.

A

min-width, max-width

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
102
Q

Which HTML meta tag is used in mobile-responsive web pages?

A

Using the viewport meta tag to control layout on mobile browsers

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
103
Q

Why is it possible to listen for events on one element that actually happen its descendent elements?

A

event bubbling

How well did you know this?
1
Not at all
2
3
4
5
Perfectly
104
Q

What does the element.closest() method take as its argument and what does it return?

A

losest() The closest() method traverses the Element and its parents (heading toward the document root) until it finds a node that matches the provided selector string.

105
Q

How can you remove an element from the DOM?

A

element.remove()

106
Q

If you wanted to insert new clickable DOM elements into the page using JavaScript, how could you avoid adding an event listener to every new element individually?

A

add class name and under the parent class

107
Q

What is the affect of setting an element to display: none?

A

When applied to a container element, setting display to none causes the container and all of its children to be invisible; thus, it acts on groups of elements as a group. This means that any child of an element with display=”none” will never be rendered even if the child has a value for display other than none

108
Q

What does the element.matches() method take as an argument and what does it return?

A

selectorString and return boolean

109
Q

How can you retrieve the value of an element’s attribute?

A

The getAttribute() method of the Element interface returns the value of a specified attribute on the element. If the given attribute does not exist, the value returned will either be null or “” (the empty string)

110
Q

At what steps of the solution would it be helpful to log things to the console?

A

every steps

111
Q

If you were to add another tab and view to your HTML, but you didn’t use event delegation, how would your JavaScript code be written instead?

A

query select the element as Dom selector and addeventlistner

112
Q

If you didn’t use a loop to conditionally show or hide the views in the page, how would your JavaScript code be written instead?

A

Write code for every situation (many else if statements)

113
Q

What is a method?

A

A method is a function which is a property of an object. There are two kind of methods: Instance Methods which are built-in tasks performed by an object instance, or Static Methods which are tasks that are called directly on an object constructor.

114
Q

How can you tell the difference between a method definition and a method call?

A
definition includes the code block and 'function'
function call is object.key(argument)
115
Q

Describe method definition syntax (structure).

A

object.key=function(){}; or assign the function inside the object

116
Q

Describe method call syntax (structure).

A

object.key(argument)

117
Q

How is a method different from any other function?

A

method is with object

118
Q

What is the defining characteristic of Object-Oriented Programming?

A

objects can contain both data (as properties) and behavior (as methods).

119
Q

What are the four “principles” of Object-Oriented Programming?

A

Abstraction,Encapsulation,Inheritance,Polymorphism

120
Q

What is “abstraction”?

A

The most important part of the term “abstraction” boils down to being able to work with (possibly) complex things in simple ways.

121
Q

What does API stand for?

A

application programming interface (API)

122
Q

What is the purpose of an API?

A

API is the acronym for Application Programming Interface, which is a software intermediary that allows two applications to talk to each other. Each time you use an app like Facebook, send an instant message, or check the weather on your phone, you’re using an API.

123
Q

What is this in JavaScript?

A

In most cases, the value of this is determined by how a function is called (runtime binding). It can’t be set by assignment during execution, and it may be different each time the function is called.

124
Q

What does it mean to say that this is an “implicit parameter”?

A

meaning that it is available in a function’s code block even though it was never included in the function’s parameter list or declared with var.

125
Q

When is the value of this determined in a function; call time or definition time?

A

call time

126
Q

What does this refer to in the following code snippet?

A

nothing….. its not called yet

127
Q

Given the above character object, what is the result of the following code snippet? Why?

A

its a me , Mario

128
Q

Given the above character object, what is the result of the following code snippet? Why?

A

undefined, cuz the ‘hello’ has no object it belongs to

129
Q

How can you tell what the value of this will be for a particular function or method definition?

A

no way… until its used, it doesn’t exist

130
Q

How can you tell what the value of this is for a particular function or method call?

A

the object that the method is being called. the object that is left of the ‘.’

131
Q

What kind of inheritance does the JavaScript programming language use?

A

prototype-based (or prototypal)

132
Q

What is a prototype in JavaScript?

A

the ultimate goal is to move properties and methods that we’d like to reuse into a “prototype” object and then tell other objects to simply delegate (verb) to that “prototype” object when they aren’t able to perform the required tasks themselves.

133
Q

How is it possible to call methods on strings, arrays, and numbers even though those methods don’t actually exist on objects, arrays, and numbers?

A

cuz its going directly to the original prototype object

134
Q

If an object does not have it’s own property or method by a given key, where does JavaScript look for it?

A

the object prototype

135
Q

What does the new operator do?

A

The new operator lets developers create an instance of a user-defined object type or of one of the built-in object types that has a constructor function.

  1. Creates a blank, plain JavaScript object.
  2. Adds a property to the new object (__proto__) that links to the constructor function’s prototype object
  3. Binds the newly created object instance as the this context (i.e. all references to this in the constructor function now refer to the object created in the first step).
  4. Returns this if the function doesn’t return an object.
136
Q

What property of JavaScript functions can store shared behavior for instances created with new?

A

prototype

137
Q

What does the instanceof operator do?

A

instanceof is a binary operator used to test if an object is of a given type. The result of the operation is either true or false.

138
Q

What is a “callback” function?

A

the function being passed around as a value

139
Q

Besides adding an event listener callback function to an element or the document, what is one way to delay the execution of a JavaScript function until some point in the future?

A

setTimeOut(function, time)

140
Q

How can you set up a function to be called repeatedly without using a loop?

A

setInterval(function, interval)

141
Q

What is the default time delay if you omit the delay parameter from setTimeout() or setInterval()?

A

0

142
Q

What do setTimeout() and setInterval() return?

A

The returned intervalID is a numeric, non-zero value which identifies the timer created by the call to setInterval(); The returned timeoutID is a positive integer value which identifies the timer created by the call to setTimeout()

143
Q

What is a code block? What are some examples of a code block?

A

{}such as function, loops, conditional,

144
Q

What does block scope mean?

A

Block scoping means declaring a variable, not just inside a function, but around any curly brackets like if statements or loops. The variable itself let i is still in memory, but the engine just won’t allow you to access it like before when we used var.

145
Q

What is the scope of a variable declared with const or let?

A

block scope

146
Q

What is the difference between let and const?

A

let can be reassigned, const can not

147
Q

Why is it possible to .push() a new value into a const variable that points to an Array?

A

because we are mutating the array, not reassign

148
Q

How should you decide on which type of declaration to use?

A

prefer const, if the value will be reassigned, then use let

149
Q

What is the syntax for writing a template literal?

A

string

150
Q

What is “string interpolation”?

A

JavaScript string interpolation is the process of embedding an expression into part of a string. A template literal is used to embed expressions. You can add values such as variables and mathematical calculations into a string using interpolation. … Template literals are the JavaScript string interpolation syntax.

151
Q

What is destructuring, conceptually?

A

assign properties of an object or values of the element from array to variables

152
Q

What is the syntax for Object destructuring?

A

const {key: newkey, key2: newkey2,…}=obj

153
Q

What is the syntax for Array destructuring?

A

const [variable1, variable2,variable3…]=array

154
Q

How can you tell the difference between destructuring and creating Object/Array literals?

A

destructuring has the object or array on the right side

155
Q

What is the syntax for defining an arrow function?

A

( ) => expression
param => expression( ‘()’ optional here)
(param1, paramN) => expression

156
Q

When an arrow function’s body is left without curly braces, what changes in its functionality?

A

has to be an expression, no statement

157
Q

How is the value of this determined within an arrow function?

A

With arrow functions thethiskeywordalwaysrepresents the object that defined the arrow function.

158
Q

What is a CLI?

A

command-line interfaces

159
Q

What is a GUI?

A

a graphical user interface

160
Q
Give at least one use case for each of the commands listed in this exercise.
man
cat
ls
pwd
echo
touch
mkdir
mv
rm
cp
A

man: check manul
cat: display file
ls: list contents in directory
pwd: what directory I’m at
echo: print the string
touch: create file
mkdir: create new directory
mv: rename directory/file
rm: delete file/directory
cp: copy file

161
Q

What are the three virtues of a great programmer?

A

laziness
impatience
hubris

162
Q

What is Node.js?

A

its JavaScript not in the browser

163
Q

What can Node.js be used for?

A

Node. js is primarily used for non-blocking, event-driven servers, due to its single-threaded nature. It’s used for traditional web sites and back-end API services, but was designed with real-time, push-based architectures in mind.

164
Q

What is a REPL?

A

The acronym REPL stands for read-eval-print loop and basically provides a programmer with an interactive programming environment.

165
Q

When was Node.js created?

A

May 27, 2009

166
Q

What back end languages have you heard of?

A

Some common backend languages are Ruby, PHP, Java, . Net, and Python. These programming languages often run on frameworks that simplify the web development process.

javaScript has event loop(only one)

167
Q

What is a computer process?

A

In computing, a process is the instance of a computer program that is being executed by one or many threads. It contains the program code and its activity.

168
Q

Roughly how many computer processes are running on your host operating system (Task Manager or Activity Monitor)?

A

more than 100

169
Q

Why should a full stack Web developer know that computer processes exist?

A

Full stack Web development is based on making multiple processes work together to form one application, so having at least a cursory awareness of computer processes is necessary. This will be extremely important when learning about applications made of multiple components, such as clients, servers, and databases.

170
Q

What is the process object in a Node.js program?

A

The process object is a global that provides information about, and control over, the current Node.js process.

171
Q

How do you access the process object in a Node.js program?

A

As a global, it is always available to Node.js applications without using require(). It can also be explicitly accessed using require():

172
Q

What is the data type of process.argv in Node.js?

A

array of string

173
Q

What is a JavaScript module?

A

In the Node.js module system, each file is treated as a separate module.

174
Q

What values are passed into a Node.js module’s local scope?

A

exports, require, module, __filename, __dirname

175
Q

Give two examples of truly global variables in a Node.js program.

A

process, buffer

176
Q

What is the purpose of module.exports in a Node.js module?

A

module.exports property exposes values from the module which can be imported into other modules by require(‘/path/to/module’) and reused.

177
Q

How do you import functionality into a Node.js module from another Node.js module?

A

require is a function used for loading a module into another module. It exposes the imported(the module been required) modules exported objects and makes them usable withing the requiring module.

178
Q

What is the JavaScript Event Loop?

A

JavaScript has a concurrency model based on an event loop, which is responsible for executing the code, collecting and processing events, and executing queued sub-tasks.

179
Q

What is different between “blocking” and “non-blocking” with respect to how code is executed?

A

blocking is something is currently on the stack

The output of an assign statement is always equal to the specified function of it’s inputs. “blocking” and “nonblocking” assignments only exist within always blocks. A blocking assignment takes affect immediately it is processed. A nonblocking assignment takes place at the end of processing the current “time delta”.

180
Q

What is a directory?

A

A node directory is a folder that contains log files, operational state, and application data stored in transactional memory.

181
Q

What is a relative file path?

A

A relative path refers to a location that is relative to a current directory.

182
Q

What is an absolute file path?

A

An absolute path always contains the root element and the complete directory list required to locate the file.

183
Q

What module does Node.js include for manipulating the file system?

A

fs

184
Q

What method is available in the Node.js fs module for writing data to a file?

A

writeFile

185
Q

Are file operations using the fs module synchronous or asynchronous?

A

both

186
Q

What is NPM?

A

npm is the world’s largest software registry. Open source developers from every continent use npm to share and borrow packages, and many organizations use npm to manage private development as well.

187
Q

What is a package?

A

A package is a file or directory that is described by a package.json file. A package must contain a package.json file in order to be published to the npm registry.

188
Q

How can you create a package.json with npm?

A

npm init –yes

189
Q

What is a dependency and how to you add one to a package?

A

its a code package. you can add them by doing npm install (package-name)

190
Q

What happens when you add a dependency to a package with npm?

A

When you (or another user) run npm install , npm will download dependencies and devDependencies that are listed in package. json that meet the semantic version requirements listed for each.

191
Q

How do you add express to your package dependencies?

A

npm install express

192
Q

What Express application method starts the server and binds it to a network PORT?

A

app.listen

193
Q

How do you mount a middleware with an Express application?

A

app.use

194
Q

Which objects does an Express application pass to your middleware to manage the request/response lifecycle of the server?

A

request object and response object

195
Q

What is the appropriate Content-Type header for HTTP messages that contain JSON in their bodies?

A

Content-Type: application/json; charset=utf-8

196
Q

What does the express.json() middleware do and when would you need it?

A

parse the incoming json string to a object that we can use

197
Q

What is the significance of an HTTP request’s method?

A

deter clients action, to make server pass matching action

198
Q

What is PostgreSQL and what are some alternative relational databases?

A

PostgreSQL is a powerful, free, open source Relational Database Management System (RDBMS). Microsoft SQL server, Oracle database,MySQL

199
Q

What are some advantages of learning a relational database?

A

A quality of many relational databases is that they support good guarantees about data integrity. They can store and modify data in a way that makes data corruption as unlikely as possible. This means that developers can set up their database to reject “bad” data and not worry about data being “half written”.

200
Q

What is one way to see if PostgreSQL is running?

A

by using the top in terminal

sudo service postgresql status

201
Q

What is a database schema?

A

A collection of tables is called a schema. A schema defines how the data in a relational database should be organized.

202
Q

What is a table?

A

A table is a list of rows each having the same set of attributes.

203
Q

What is a row?

A

all the data describe one thing

204
Q

What is SQL and how is it different from languages like JavaScript?

A

imperative programming languages such as JavaScript, where you basically tell the JavaScript runtime what to do and how to do it.SQL is a declarative programming language. In declarative languages, programmers describe the results they want and the programming environment comes up with its own plan for getting those results.

205
Q

How do you retrieve specific columns from a database table?

A

select “”,
“”
from “”

206
Q

How do you filter rows based on some specific criteria?

A

where

207
Q

What are the benefits of formatting your SQL?

A

easier to read, consistence

208
Q

What are four comparison operators that can be used in a where clause?

A

=,,!=

209
Q

How do you limit the number of rows returned in a result set?

A

limit number

210
Q

How do you retrieve all columns from a database table?

A

select *

211
Q

How do you control the sort order of a result set?

A

order by “”

212
Q

How do you add a row to a SQL table?

A

select into “form name” (“column name”)

value (‘value’)

213
Q

What is a tuple?

A

a list of values is referred to as a tuple.

214
Q

How do you add multiple rows to a SQL table at once?

A

values (‘…’,’…’)

(‘…’,’…’)

215
Q

How do you get back the row being inserted into a table without a separate select statement?

A

returning *;

216
Q

How do you update rows in a database table?

A

update “forename”
set “column”=’value’
where condition

217
Q

Why is it important to include a where clause in your update statements?

A

to target specific rows

218
Q

How do you delete rows from a database table?

A

delete from “filename”

where condition

219
Q

How do you accidentally delete all rows from a table?

A

where there is no condition

220
Q

What is a foreign key?

A

two tables share the same column name

221
Q

How do you join two SQL tables?

A

select “table”.”category”
from “table”
join “table” using (“foreign key”)

222
Q

How do you temporarily rename columns or tables in a SQL statement?

A

use as keyword

223
Q

What are some examples of aggregate functions?

A

avg(),max(),every(),min()

224
Q

What are the three states a Promise can be in?

A

pending: initial state, neither fulfilled nor rejected.
fulfilled: meaning that the operation was completed successfully.
rejected: meaning that the operation failed.

225
Q

How do you handle the fulfillment of a Promise?

A

by using promise.then()

226
Q

How do you handle the rejection of a Promise?

A

by using promise.catch()

227
Q

What is Array.prototype.filter useful for?

A

it is good to sort the data out based on the condition given

228
Q

What is Array.prototype.map useful for?

A

it is good to transform the whole array under certain rule

229
Q

What is Array.prototype.reduce useful for?

A

combine elements from an array into one value

230
Q

What is “syntactic sugar”?

A

syntactic sugar is syntax within a programming language that is designed to make things easier to read or to express.

231
Q

What is the typeof an ES6 class?

A

function

232
Q

Describe ES6 class syntax.

A
class something {
constructor (a, b, c){
this.a=a;
this.b =bb;
}

method() {
}
}

233
Q

What is “refactoring”?

A

restructure the code without changing its function

234
Q

What is Webpack?

A

It’s a tool that lets you bundle your JavaScript applications (supporting both ESM and CommonJS), and it can be extended to support many different assets such as images, fonts and stylesheets.

235
Q

How do you add a devDependency to a package?

A

npm install –save-dev

236
Q

What is an NPM script?

A

run in node.js to execute tool

237
Q

How do you execute Webpack with npm run?

A

with script typied in package.json and npm run build

238
Q

How are ES Modules different from CommonJS modules?

A

What kind of modules can Webpack support?

239
Q

How are ES Modules different from CommonJS modules?

A

While CommonJS and ES6 modules share similar syntax, they work in fundamentally different ways: ES6 modules are pre-parsed in order to resolve further imports before code is executed. CommonJS modules load dependencies on demand while executing the code.

240
Q

What kind of modules can Webpack support?

A

Webpack supports the following module types natively: ECMAScript modules. CommonJS modules. AMD modules.

241
Q

How do you mount a React element to the DOM?

A

by using ReactDOM.render

242
Q

How do you mount a React element to the DOM?

A

by using ReactDOM.render

243
Q

What is Babel?

A

Babel is a toolchain that is mainly used to convert ECMAScript 2015+ code into a backwards compatible version of JavaScript in current and older browsers or environments.

244
Q

What is a Plug-in?

A

a plug-in (or plugin, add-in, addin, add-on, or addon) is a software component that adds a specific feature to an existing computer program.

245
Q

What is a Webpack loader?

A

Loaders are transformations that are applied to the source code of a module.

246
Q

How can you make Babel and Webpack work together?

A

install babel-loader

247
Q

What Array method is commonly used to create a list of React elements?

A

the map method

248
Q

What is the best value to use as a “key” prop when rendering lists?

A

The best way to pick a key is to use a string that uniquely identifies a list item among its siblings. Most often you would use IDs from your data as keys

249
Q

What are controlled components?

A

the React component that renders a form also controls what happens in that form on subsequent user input. An input form element whose value is controlled by React in this way is called a “controlled component”.

250
Q

What two props must you pass to an input for it to be “controlled”?

A

value and onChange

251
Q

What does express.static() return?

A

it returns a middleware

252
Q

What is the local __dirname variable in a Node.js module?

A

The directory name of the current module.

253
Q

What does the join() method of Node’s path module do?

A

The path.join() method joins all given path segments together using the platform-specific separator as a delimiter, then normalizes the resulting path.

254
Q

What does fetch() return?

A

A Promise that resolves to a Response object.

255
Q

What is the default request method used by fetch()?

A

GET

256
Q

How do you specify the request method (GET, POST, etc.) when calling fetch?

A

we can add an object containing the request method and pass the object as the argument to the fetch()method

257
Q

When does React call a component’s componentDidMount method?

A

componentDidMount() is invoked immediately after a component is mounted (inserted into the tree).

258
Q

Name three React.Component lifecycle methods.

A

render()
componentDidMount()
constructor()

259
Q

How do you pass data to a child component?

A

passing by props