JavaScript Technical Questions Flashcards
What is the easiest way to empty an array in JavaScript?
The easiest way to achieve this is to set the array’s length to be 0:
let array = [ 'a', 'b', 'c', 'd' ]; console.log(array); // [ 'a', 'b', 'c', 'd' ]; array.length = 0; console.log(array1); // [ ]
What are Props in React?
Props (or Properties) in React are used to transfer data from one component to the next (parent component to child component).
* They are typically used to render dynamically generated data.
* A child component can never send props to a parent component since this flow is unidirectional (parent to child).
What is a Class Component in React?
Class Components are ES6 classes that read props and state, and return JSX. These require the use of React extensions. It uses a render() function to return the HTML that will be displayed in the component.
import React, {Component} from 'react'; export default class App extends Component { render() { return () } }
What is State in React?
A built-in React Object that is used to create and manage data within components. It is different from props because it is used to store data rather than pass data.
What is a Component in React?
A self-contained, reusable code block that divides the user interface into smaller pieces (as opposed to building the entire UI in a single file).
* There are Class Components and Functional Components, but it is recommended to use Functional Components whenever possible.
* In React, rendering logic and markup (JSX) live together within a component
What is state in JavaScript?
State describes the status of the entire program (global state) or an individual object (local state).
* It could be text, a number, a boolean, or another data type.
* It’s a common tool for coordinating code. For example, once you update state, a bunch of different functions can instantly react to that change.
What is a Functional Component in React? (and write a quick example)
Functional Components (recommended) are ES6 functions that return a React element (JSX). They allow states to be used inside them (vs. Class Components, which do not). They take arguments and props, and return JSX
import React from 'react'; const App = (props) => { return <h1>Hello, {props.name}</h1>; } export default App;
OR
function App(props) { return <h1>Hello, {props.name}</h1>; } export default App;
ES6 Template Literals offer a lot of flexibility in generating strings, can you give an example?
Template literals allow for string interpolation without the need for concatenating different parts of the string with the addition operator. This allows for easier to write (and read) syntax
What is a JavaScript Promise?
A Promise in JavaScript is an object that represents the eventual completion or failure of an async operation.
* It is basically a returned object to which you attach callbacks, instead of passing callbacks into a function
What’s the difference between ES5 and ES6?
Several key differences include:
* Variable declarations (let or const, instead of var)
* Arrow functions
* Template literals for string interpolation
* Default parameter values
* Spread operator
What is JSX in React?
JSX is a syntax extension for JavaScript that lets you write HTML-like markup inside a JavaScript file. This allows rendering logic to be kept with the “HTML” it is rendering within a component
What is an interface in TypeScript?
In TypeScript, an interface is used to describe the shape of an object, and can be extended by other interfaces
What is functional programming?
- A style of programming that emphasizes the evaluation of expressions, rather than an execution of commands.
- It is a declarative paradigm, and its functions use expressions to map values to other values (vs. a sequence of imperative statements that update the state of the program)
What does Array.reduce() do?
- Performs some operation on all elements of an array and returns a single value as a result.
- Takes a callback function that we pass 2 arguments to (an accumulator, and a current value), and takes an optional 2nd argument as the first value of the accumulator.
What does Array.filter() do?
- Takes an array and returns a new array with only the values that meet certain criteria.
- Often used to select a subset of data from an array.
- It does not mutate the original array.
What does Array.map() do?
- Takes an array of values and applies a transformation to each value in the array.
- It returns a new array with those transformed values (it does not mutate the original array)
What are Higher-Order Functions?
Functions that take one or more functions as arguments, or return a function as their result