Miscallaneous 2

Question 1

Native VS Hybrid - Which is the best tech stack for your mobile app.

Answer 1

• game needs to be built with native, not hybrid
• react native, flutter and ionic are hybrid
• über eats is react native
• Hybrid apps or hybrid mobile apps are applications created with web technologies. This includes languages like HTML5, CSS and JavaScript. They are called hybrid because they possess elements of both native and web apps.
• convert the code into native (react native and flutter), but ionic is strictly web
• negative of hybrid is that they don’t interact with hardware very well
• location - will take a noticeable amount of time
• if you use camera a lot better to make native
• iOS has API for hardware, android doesn’t have one for camera
• use as little libraries as possible
• maintaining is hard
• it’ll give errors in 6 months time

Question 2

what is oop

Answer 2

• style of programming, or a programming paradigm
• encapsulation
  abstraction
  inheritance
  polymorphism

Question 3

encapsulation

Answer 3

* grouping of related var and f
let employee = {
base_salary = 30
overtime = 10,
rate = 20
getWage: function(){
return this.base_salary + (this.overtime * this.rate)
}
}
employee.getWage()
* local storage is an object in browser that allows to save to it
* in procedural programming variables and functions are decoupled
* procedural code has functions with lots of parameters
* oop functions have no parameters, making it easier to maintain that function
* benefit: reduce complexity + increase reusability

Question 4

abstraction

Answer 4

• dvd player has complex board inside and a play button outside; implementation is hidden behind public interface
• in object hide functions and variables to make interface simpler
• benefits: reduce complexity + isolate the impact of change - if you change inside methods and properties it has no contact with outside

if we have every method public, every time we add a parameter we have to add an argument everywhere to it
if we have more parameters than the arguments, the parameters that have no corresponding arguments are set to undefined.

Question 5

inheritance

Answer 5

• benefit: mechanism that allows to eliminate redundant code

* all buttons have shared code which we can put in one object and have the buttons that vary inherit them

Question 6

polymorphism

Answer 6

• benefit: technique that allows to get rid of long if/else or switch statements
• you can just use one render method to render them all differently

Polymorphism means many forms. In terms of programming, it specifically refers how sub classes inherit all of the properties from a parent class but can also have their own specific properties. For example, let’s think about a teacher and the students inside a classroom. They have many characteristics in common, such as name, age, and so on. However, students may have their own characteristics that a teacher doesn’t, such as grade.

https://www.youtube.com/watch?v=YkhLw5tYR6c

The word polymorphism means having many forms. In simple words, we can define polymorphism as the ability of a message to be displayed in more than one form. Real life example of polymorphism: A person at the same time can have different characteristic. Like a man at the same time is a father, a husband, an employee

Question 7

ecma and ecmascript

Answer 7

• ecma organization that defines standards for technologies

* ecmascript is a specification (standard), js is programming language that conforms to ecmascript specification

Question 8

how to you define an object

what is object behavior

Answer 8

• object literal is a simple way to define an object, but you can also define them with a factory or a constructor
• when object has methods, we say it has behavior.

Object literal is not a good method to copy an object

Question 9

factory and constructor functions

Answer 9

factory function, constructor function and class are all functions

Factory functions
A factory function returns a (presumably new) object. In JavaScript, any function can return an object. When it does so without the new keyword, it’s a factory function.
function person(firstName, lastName, age) {
  const person = {};
  person.firstName = firstName;
  person.lastName = lastName;
  person.age = age;
  return person;
}
If you look at the above code inside the function, it creates a new object and attached passed arguments to that object as properties to that and return the new object. That is a simple factory function in JavaScript. 
Constructor Functions
 differ only from its use case and a convention. Other than that factory functions and constructor functions are similar. The convention of defining a constructor function is to use Pascal case to denote that this is a constructor function, the use case of this function is that creating similar types of objects with the new keyword, then later we can do instance checks using theinstanceof keyword in JavaScript. 

function Person(firstName, lastName, age) {
  this.firstName = firstName;
  this.lastName = lastName;
  this.age = age;
}

• every object has a property called constructor, referring to function that created the object

? every object has a property of a constructor (which is a function) and property prototype (which is an object)

further deeper reading
https://medium.com/javascript-scene/javascript-factory-functions-vs-constructor-functions-vs-classes-2f22ceddf33e

Question 10

primitives vs objects

Answer 10

• value types (primitives)
  
  • number, string, boolean, symbol, undefined, null
• reference types (objects)
  
  • array, object, function
• objects are copied by their reference: https://www.udemy.com/course/javascript-object-oriented-programming/learn/lecture/10019692#overview

Question 11

properties in js

Answer 11

• in js we can add properties on the fly; because we don’t have classes we don’t have to have properties defined ahead of time
• makes js powerful and easy to work with
  circle.location
  if location is dynamic use brackets for variable
  circle[propertyName]
  also if you have special char or space
  circle[center-location]

to delete a property
delete circle.location

Question 12

• enumerating properties

Answer 12

for(let key in circle){
if(typeof circle[key]!== ‘function’)
console.log(key, circle[key]
}

if(‘radius’ in circle){
//to check for property
}

Question 13

define execution context

Answer 13

Execution context is a concept in the language spec that—in layman’s terms—roughly equates to the ‘environment’ a function executes in; that is, variable scope (and the scope chain, variables in closures from outer scopes), function arguments, and the value of the this object.

Question 14

scope vs closure

Answer 14

@ 3:00 https://www.udemy.com/course/javascript-object-oriented-programming/learn/lecture/10019708#overview

scope is temporary, closure variables will stay in memory after parent function runs

Question 15

how do you make private properties and methods?

Answer 15

• by making local variables and functions, we now have private properties and methods in an object
• getters and setters @ 2:00 https://www.udemy.com/course/javascript-object-oriented-programming/learn/lecture/10019718#overview

// We can hide the details by using private members. Replace “this” with “let”.

function Circle(radius) {

// Public member
this.radius = radius;

// Private member
let defaultLocation = {};

}

Question 16

how to create an object in JS

Answer 16

// The simplest way to create an object is using an object literal
const circle = {

radius: 1,
draw: function() {}

};
// To create multiple objects with the same structure and behaviuor (methods), use a factory or a constructor.

// Factory function (doesn't use a new keword)
function createCircle(radius) {

return {

radius,
draw: function() {}

}
}

// Constructor function
function Circle(radius) {

this. radius = radius;
this. draw = function() {}

}
// Every object has a "constructor" property which returns the function that was used to construct or create that object.
const x = {};

x.constructor; // returns Object()

//class syntax

class Button {
  constructor(value) {
    this.value = value;
  }

click() {
alert(this.value);
}
}

let button = new Button(“hello”);

Question 17

what do we mean when we say functions are objects in js

Answer 17

// In JavaScript, functions are objects. They have properties and methods.
Circle.name;
Circle.length;
Circle.constructor; // returns Function()

Circle.call({}, 1); // to call the Circle function

Circle.apply({}, [1]);

Question 18

by value vs by reference

Answer 18

// Value types are copied by their value, reference types are copied by their reference.
// Value types in JavaScript are: String, Number, Boolean, Symbol, undefined and null
// Reference types are: Object, Function and Array

let user = { name: ‘John’ };

let admin = user;

admin.name = ‘Pete’; // changed by the “admin” reference

alert(user.name); // ‘Pete’, changes are seen from the “user” reference

Question 19

how are js objects dynamic.

Answer 19

// JavaScript objects are dynamic. You can add/remove properties:
circle.location = {};

circle[‘location’] = {};
delete circle.location;

Question 20

// To enumerate the members in an object:
// To see if an object has a given property

Answer 20

for (let key in circle) console.log(key, circle[key]);
Object.keys(circle);

if (‘location’ in circle)

Question 21

// To define a getter/setter,

Answer 21

use Object.defineProperty():

Object.defineProperty(this, ‘defaultLocation’, {

get: function() { return defaultLocation; },
set: function(value) { defaultLocation = value; }

});