DEV Community

Cover image for LeetCode Challenge: 48. Rotate Image - JavaScript Solution πŸš€
Rahul Kumar Barnwal
Rahul Kumar Barnwal

Posted on

7 1 3 2 3

LeetCode Challenge: 48. Rotate Image - JavaScript Solution πŸš€

Top Interview 150

The Rotate Image problem involves rotating an nΓ—n matrix by 90 degrees clockwise, in place. Let’s solve LeetCode 48: Rotate Image step by step.


πŸš€ Problem Description

Given an nΓ—n matrix:

  • Rotate the matrix in place by 90 degrees clockwise.
  • In-place means modifying the original matrix without allocating extra space for another matrix.

πŸ’‘ Examples

Example 1
Mat1

Input: matrix = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]  
Output: [[7, 4, 1], [8, 5, 2], [9, 6, 3]]
Enter fullscreen mode Exit fullscreen mode

Example 2
Mat2

Input: matrix = [[5, 1, 9, 11], [2, 4, 8, 10], [13, 3, 6, 7], [15, 14, 12, 16]]  
Output: [[15, 13, 2, 5], [14, 3, 4, 1], [12, 6, 8, 9], [16, 7, 10, 11]]
Enter fullscreen mode Exit fullscreen mode

Constraints

  • 1≀m,n≀10
  • βˆ’100≀matrix[i][j]≀100

πŸ† JavaScript Solution

We solve this problem in two steps:

  1. Transpose the Matrix:

    • Swap elements symmetrically across the diagonal.
  2. Reverse Each Row:

    • Reverse the order of elements in each row to achieve the rotation.

Implementation

var rotate = function(matrix) {
    const n = matrix.length;

    for (let i = 0; i < n; i++) {
        for (let j = i + 1; j < n; j++) {
            [matrix[i][j], matrix[j][i]] = [matrix[j][i], matrix[i][j]];
        }
    }

    for (let i = 0; i < n; i++) {
        matrix[i].reverse();
    }
};
Enter fullscreen mode Exit fullscreen mode

πŸ” How It Works

  1. Transpose the Matrix:
    • Swap matrix[i][j] with matrix[j][i] for all i<j.
    • This converts rows into columns.

Example:

Input:  [[1, 2, 3],       Transposed:  [[1, 4, 7],  
         [4, 5, 6],  ->                [2, 5, 8],  
         [7, 8, 9]]                    [3, 6, 9]]
Enter fullscreen mode Exit fullscreen mode
  1. Reverse Each Row:
    • Reverse the elements of each row to achieve the clockwise rotation.

Example:

Transposed: [[1, 4, 7],       Rotated: [[7, 4, 1],  
             [2, 5, 8],  ->            [8, 5, 2],  
             [3, 6, 9]]                [9, 6, 3]]
Enter fullscreen mode Exit fullscreen mode

πŸ”‘ Complexity Analysis

  • Time Complexity:

    • Transposing the matrix takes O(n^2).
    • Reversing each row takes O(n^2).
    • Total: O(n^2)
  • Space Complexity: O(1), as the rotation is done in place.


πŸ“‹ Dry Run

Input: matrix = [[1, 2, 3], [4, 5, 6], [7, 8, 9]]
Dry Run
Output: [[7, 4, 1], [8, 5, 2], [9, 6, 3]]


✨ Pro Tips for Interviews

  1. Clarify Constraints:

    • Ensure the matrix is always square (nΓ—n).
  2. Highlight In-Place Operations:

    • Emphasize the efficiency of the transpose-and-reverse method.
  3. Edge Cases:

    • Single-element matrix: [[1]].
    • 2Γ—2 matrix: [[1, 2], [3, 4]].

πŸ“š Learn More

Check out the full explanation and code walkthrough on my previous Dev.to post:
πŸ‘‰ Spiral Matrix - JavaScript Solution

What’s your preferred method to solve this problem? Let’s discuss! πŸš€


Study

AWS GenAI LIVE image

Real challenges. Real solutions. Real talk.

From technical discussions to philosophical debates, AWS and AWS Partners examine the impact and evolution of gen AI.

Learn more

Top comments (1)

Collapse
 
rahulgithubweb profile image
Rahul Kumar Barnwal β€’

Follow Me on GitHub πŸš€

If you found this solution helpful, check out more of my projects and solutions on my GitHub profile.

Don't forget to follow for more updates!

Tiugo image

Fast, Lean, and Fully Extensible

CKEditor 5 is built for developers who value flexibility and speed. Pick the features that matter, drop the ones that don’t and enjoy a high-performance WYSIWYG that fits into your workflow

Start now

DEV Launches and Announcements

🐯 πŸš€ Timescale is now TigerData: Building the Modern PostgreSQL for the Analytical and Agentic Era

TL;DR: Eight years ago, we launched Timescale to bring time-series to PostgreSQL. Our mission was simple: help developers building time-series applications.

Check out the challenge

DEV is bringing live events to the community. Dismiss if you're not interested. ❀️