📕
Dan Fitz's Notes
  • README
  • Ai
    • Supervised Machine Learning
      • Introduction To Machine Learning
      • Regression With Multiple Input Variables
      • Classification
  • Csharp
    • C Sharp Advanced
      • Generics
      • Delegates
      • Lambda Expressions
      • Events
    • C Sharp Fundamentals
      • Intro To C
      • Primitive Types And Expressions
      • Non Primitive Types
      • Control Flow
      • Arrays And Lists
      • Working With Dates
      • Working With Text
      • Working With Files
      • Debugging Applications
    • C Sharp Intermediate
      • Classes
      • Association Between Classes
      • Inheritance
      • Polymorphism
      • Interfaces
  • Java
    • Inheritance Data Structures Java
      • Inheritance Polymorphism Using Overriding And Access Modifiers
      • Abstract Classes And Debugging
      • File I O And Exceptions
      • Collections Maps And Regular Expressions
    • Intro To Java
      • Introduction To Java Classes And Eclipse
      • Unit Testing Arrays And Array Lists
      • Static Variables Methods And Polymorphism Using Overloading
  • Javascript
    • Algorithms Data Structures
      • Big O Notation
      • Analyzing Performance Of Arrays And Objects
      • Problem Solving Approach
      • Problem Solving Patterns
      • Recursion
      • Searching Algorithms
      • Bubble Selection And Insertion Sort
      • Merge Sort
      • Quick Sort
      • Radix Sort
      • Data Structures Introduction
      • Singly Linked Lists
      • Doubly Linked Lists
      • Stacks And Queues
      • Binary Search Trees
      • Tree Traversal
      • Binary Heaps
    • Complete Nodejs
      • Understanding Node.js
      • REST AP Is And Mongoose
      • API Authentication And Security
      • Node.js Module System
      • File System And Command Line Args
      • Debugging Node.js
      • Asynchronous Node.js
      • Web Servers
      • Accessing API From Browser
      • Application Deployment
      • Mongo DB And Promises
    • Complete React Native
      • Working With Content
      • Building Lists
      • Navigating Users Between Screens
      • State Management
      • Handling Screen Layout
      • Setting Up An App
      • More On Navigation
      • Advanced Statement Management With Context
      • Building A Custom Express API
      • In App Authentication
    • Epic React
      • React Fundamentals
      • React Hooks
      • Advanced React Hooks
      • Advanced React Patterns
      • React Performance
    • Fireship Firestore
      • Firestore Queries And Data Modeling Course
      • Model Relational Data In Firestore No SQL
    • Functional Light Javascript
      • Intro
      • Function Purity
      • Argument Adapters
      • Point Free
      • Closure
      • Composition
      • Immutability
      • Recursion
      • List Operations
      • Transduction
      • Data Structure Operations
      • Async
    • Js Weird Parts
      • Execution Contexts And Lexical Environments
      • Types And Operators
      • Objects And Functions
      • Object Oriented Java Script And Prototypal Inheritance
      • Defining Objects
    • Mastering Chrome Dev Tools
      • Introduction
      • Editing
      • Debugging
      • Networking
      • Auditing
      • Node.js Profiling
      • Performance Monitoring
      • Image Performance
      • Memory
    • React Complete Guide
      • What Is React
      • React Basics
      • Rendering Lists And Conditionals
      • Styling React Components
      • Debugging React Apps
      • Component Deep Dive
      • Building A React App
      • Reaching Out To The Web
      • Routing
    • React Testing
      • Intro To Jest Enzyme And TDD
      • Basic Testing
      • Redux Testing
      • Redux Thunk Testing
    • Serverless Bootcamp
      • Introduction
      • Auction Service Setup
      • Auction Service CRUD Operations
      • Auction Service Processing Auctions
    • Testing Javascript
      • Fundamentals Of Testing
      • Static Analysis Testing
      • Mocking Fundamentals
      • Configuring Jest
      • Test React Components With Jest And React Testing Library
    • Typescript Developers Guide
      • Getting Started With Type Script
      • What Is A Type System
      • Type Annotations In Action
      • Annotations With Functions And Objects
      • Mastering Typed Arrays
      • Tuples In Type Script
      • The All Important Interface
      • Building Functionality With Classes
    • Web Performance With Webpack
      • Intro
      • Code Splitting
      • Module Methods Magic Comments
  • Other
    • Algo Expert
      • Defining Data Structures And Complexity Analysis
      • Memory
      • Big O Notation
      • Logarithm
      • Arrays
      • Linked Lists
      • Hash Tables
      • Stacks And Queues
      • Strings
      • Graphs
      • Trees
    • Aws Solutions Architect
      • AWS Fundamentals IAM EC 2
    • Fundamentals Math
      • Numbers And Negative Numbers
      • Factors And Multiples
      • Fractions
    • Mysql Bootcamp
      • Overview And Installation
      • Creating Databases And Tables
      • Inserting Data
      • CRUD Commands
      • The World Of String Functions
      • Refining Our Selections
      • The Magic Of Aggregate Functions
    • Random Notes
      • Understanding React Hooks
  • Python
    • Data Analysis Using Python
      • Loading Querying And Filtering Data Using The Csv Module
      • Loading Querying Joining And Filtering Data Using Pandas
      • Summarizing And Visualizing Data
    • Intro To Python
      • Course Introduction Intro To Programming And The Python Language Variables Conditionals Jupyter Notebook And IDLE
      • Intro To Lists Loops And Functions
      • More With Lists Strings Tuples Sets And Py Charm
      • Dictionaries And Files
Powered by GitBook
On this page
  • Frequency Counter Pattern
  • Multiple Pointers Pattern
  • Sliding Window Pattern
  • Divide and Conquer Pattern
  1. Javascript
  2. Algorithms Data Structures

Problem Solving Patterns

You're faced with a tough challenge. What are the steps you can take to make it solvable? This section will focus on coding blueprints or archetypes or patterns that you can keep in your back pocket to help solve some problems.

Here's the patterns we'll talk about:

  1. Frequency counter pattern

  2. Multiple pointers pattern

  3. Sliding Window Pattern

  4. Divide and Conquer Pattern

Frequency Counter Pattern

When you need to compare values, especially how often those values appear, you can collect them in objects/sets using the frequency counter pattern.

Often, the naive solution to these comparisons is O(n^2) because it uses nested loops. Take the following example:

// This function compares arr1 to arr2 to see if arr2 contains the squared versions of all numbers in arr1
const same = (arr1, arr2) => {
  if (arr1.length !== arr2.length) return false; // <= Short circuit for a fast return

  // FIRST LOOP
  for (let i = 0; i < arr1.length; i++) {
    const correctIndex = arr2.indexOf(arr1[i] * arr1[i]); // <= SECOND LOOP
    if (correctIndex === -1) return false;

    arr2.splice(correctIndex, 1);
  }

  return true;
};

same([1, 2, 3], [4, 1, 9]); // <= returns true

Notice how we have a nested loop, making the time complexity quadratic. Here's the frequency counter solution:

const frequencySame = (arr1, arr2) => {
  if (arr1.length !== arr2.length) return false;

  const frequencyCounter1 = {};
  const frequencyCounter2 = {};

  // Loop through arr1 and COUNT occurrence of values
  for (let val of arr1) {
    frequencyCounter1[val] = frequencyCounter1[val]
      ? frequencyCounter1[val] + 1
      : 0;
  }

  // Loop through arr2 and COUNT occurrence of values
  for (let val of arr2) {
    frequencyCounter2[val] = frequencyCounter2[val]
      ? frequencyCounter2[val] + 1
      : 0;
  }

  // Check that frequency counters don't have any differences
  for (let key in frequencyCounter1) {
    if (!frequencyCounter2[key * key]) return false; // <= Is there a square of the value?
    if (frequencyCounter2[key * key] !== frequencyCounter1[key]) return false; // <= Do they have the same # of occurrences?
  }

  // If all tests passed in frequency counter, it's true!
  return true;
};

Notice that the frequency counter pattern only has a time complexity of O(3n) because there are 3 loops, which can be simplified to O(n).

Multiple Pointers Pattern

The multiple pointers pattern maintains several pointers corresponding to positions/indices in a data structure, moving those pointers from the beginning, from the end, or towards the middle depending on some set conditions.

Let's see a naive vs. multiple pointer solution to a problem:

// Create a function that takes an ALREADY sorted array of numbers and tries to return the first 2 numbers with a sum = 0

// This naive solution is `O(n^2)` because it's a nested loop
// For each number, it loops through EVERY number after it to see if any sums to 0
const naiveSumZero = nums => {
  for (let i = 0; i < nums.length; i++) {
    for (let j = i + 1; j < nums.length; j++) {
      if (nums[i] + nums[j] === 0) return [nums[i], nums[j]];
    }
  }
};

// This multiple pointers solution is `O(n)` because it only iterates through the array ONCE
const pointersSumZero = nums => {
  // Maintaining 2 pointers at opposite ends of the array...
  let left = 0;
  let right = nums.length - 1;

  // While the pointers don't meet in the middle or CROSS over each other (b/c at that point we've exhausted our options)...
  while (left < right) {
    const sum = nums[left] + nums[right];
    // Return numbers if sum is 0
    if (sum === 0) {
      return [nums[left], nums[right]];
      // If we have a positive sum though, that means the right number's absolute value is larger, so move to the smaller number before it
    } else if (sum > 0) {
      right--;
      // Otherwise, it's a negative sum, so the left number's absolute value is larger; we need to move to the next number
    } else {
      left++;
    }
  }
};

Sliding Window Pattern

The sliding window pattern is a way to obtain a subset of data by creating a window that you move around and change size depending on certain conditions.

Here's the naive solution to a problem that requires tracking a subset of data:

// Create a function that takes in (a) sorted array of numbers and (b) n
// That function should return the highest sum from consecutive n set of numbers in that array
// For example, [1, 2, 3, 4], 2 should return 7

// This naive solution is closer to `O(n^2)`
const findSubArraySum = (nums, n) => {
  if (n > nums.length) return null; // <= short circuit

  let max = -Infinity; // <= Ensures NEGATIVE (on top of positive) numbers get replaced by temp

  // First loop
  for (let i = 0; i < nums.length - n + 1; i++) {
    let temp = 0;
    // Almost a second loop (especially if nums and n are LARGE, e.g., 1,000,000 nums and n = 100,000)
    for (let j = 0; j < n; j++) {
      temp += nums[i + j];
    }

    if (temp > max) max = temp;
  }

  return max;
};

Here's the sliding window solution:

const slidingSubArraySum = (nums, n) => {
  if (n > nums.length) return null; // <= short circuit

  let left = nums[0];
  let right = nums[n - 1];

  // Initialize max and temp
  let max = 0;
  let temp = 0;
  for (let i = 0; i < n; i++) max += nums[i];
  temp = max;

  // Loop through array ONCE, removing left-most number in window and adding number to the right of window
  // In other words, you're SLIDING the window's EDGES
  for (let i = n; i < nums.length; i++) {
    temp = temp - nums[i - n] + nums[i];
    max = Math.max(max, temp); // <= simple boolean comparison
  }

  return max;
};

Note: The key difference between solutions is that the sliding window removes the redundancy of looping through every number and adding them up. You know every number in the middle is shared between iterations. You can just remove the left edge and add to the right edge.

Divide and Conquer Pattern

The divide and conquer pattern is the process of dividing a data set into smaller chunks and repeating some process on those subsets of data. (By dividing the data, it can significantly decrease time complexity.)

Let's take a look at search algorithms quickly to show off the value of divide and conquer.

In the naive solution, we implement linear search, which is O(n) because it loops through the data set once.

// Create a function that returns the index where some value is located in a SORTED array (if none found, return -1)
const linearSearch = (arr, num) => {
  for (let i = 0; i < arr.length; i++) if (arr[i] === num) return i;
  return -1;
};

In the divide and conquer solution, we perform binary search, which is O(log n). The basic idea is this:

  1. Find the middle point of a data set.

  2. Compare if it's larger, smaller, or equal to the value you're searching for.

    • If it's larger, grab the subset of numbers BEFORE the middle point

    • If it's smaller, grab the subset of numbers AFTER the middle point

    • If it's equal, return its index!

  3. Eventually, you either find the number or you run out of the ability to cut your data set in half, so you return -1.

Note: Binary search is specifically O(log 2 n) because its halving the data set with each attempt (basically the opposite of doubling it with every step, which is 2^x).

PreviousProblem Solving ApproachNextRecursion

Last updated 3 years ago