path.basename and path.dirname in Node.js - Step-by-Step Execution

Concept Flow - path.basename and path.dirname

Input: full file path

↓

Extract file name

↓

Extract directory path

↓

Output: base name and directory name

The flow shows how a full file path is split into the file name using basename and the directory path using dirname.

Execution Sample

Node.js

const path = require('path');
const fullPath = '/home/user/docs/file.txt';
const base = path.basename(fullPath);
const dir = path.dirname(fullPath);
console.log(base, dir);

This code extracts the file name and directory path from a full file path string.

Execution Table

Step	Action	Input	Output
1	Call path.basename(fullPath)	/home/user/docs/file.txt	file.txt
2	Call path.dirname(fullPath)	/home/user/docs/file.txt	/home/user/docs
3	Print base and dir	base='file.txt', dir='/home/user/docs'	Output: 'file.txt /home/user/docs'
4	End	No more actions	Execution complete

💡 All functions executed, outputs derived from input path string

Variable Tracker

Variable	Start	After Step 1	After Step 2	After Step 3	Final
fullPath	/home/user/docs/file.txt	/home/user/docs/file.txt	/home/user/docs/file.txt	/home/user/docs/file.txt	/home/user/docs/file.txt
base	undefined	file.txt	file.txt	file.txt	file.txt
dir	undefined	undefined	/home/user/docs	/home/user/docs	/home/user/docs

Key Moments - 2 Insights

Why does path.basename return only 'file.txt' and not the full path?

Because path.basename extracts only the last part of the path, which is the file name, as shown in execution_table step 1.

Why does path.dirname return the path without the file name?

Because path.dirname extracts everything before the last separator, which is the directory path, as shown in execution_table step 2.

Visual Quiz - 3 Questions

Look at the execution table, what is the output of path.basename at step 1?

A /home/user/docs/file.txt

B file.txt

C /home/user/docs

D docs

💡 Hint

Check the Output column in execution_table row for step 1

At which step does the variable 'dir' get its value?

A Step 2

B Step 1

C Step 3

D Step 4

💡 Hint

Look at variable_tracker row for 'dir' and see when it changes from undefined

If the input path was '/folder/sub/file.js', what would path.dirname return?

A /folder

B file.js

C /folder/sub

D /folder/sub/file.js

💡 Hint

Recall path.dirname returns the directory part before the last slash

Concept Snapshot

path.basename(path) returns the file name from a full path.
path.dirname(path) returns the directory path without the file name.
Both work by splitting the path string at the last separator.
Use these to separate file names and folders easily.

Full Transcript

This lesson shows how Node.js path module functions basename and dirname work. Given a full file path string, basename extracts the file name part, and dirname extracts the directory path part. The execution table traces calling basename and dirname on '/home/user/docs/file.txt', showing the outputs 'file.txt' and '/home/user/docs' respectively. Variables track these values step-by-step. Key moments clarify why basename returns only the file name and dirname returns the folder path. The quiz tests understanding of these outputs and variable changes. The snapshot summarizes usage: basename gets the file name, dirname gets the folder path from a full path string.

Practice

1. What does path.basename return when given a full file path?

easy

A. The folder path only

B. The file name with extension

C. The full path unchanged

D. The file extension only

Solution

1. Step 1: Understand path.basename purpose

   This function extracts the last part of a path, which is usually the file name with its extension.

2. Step 2: Compare with other path parts

   Unlike path.dirname which returns the folder path, path.basename returns the file name part.

3. Final Answer:

   The file name with extension -> Option B

4. Quick Check:

   basename = file name [OK]

Hint: basename gives file name, dirname gives folder path [OK]

Common Mistakes:

• Confusing basename with dirname
• Expecting basename to return folder path
• Thinking basename returns file extension only

2. Which of the following is the correct syntax to get the directory name from a path using Node.js path module?

easy

A. path.getDirName('/home/user/file.txt')

B. path.getdirname('/home/user/file.txt')

C. path.dirName('/home/user/file.txt')

D. path.dirname('/home/user/file.txt')

Solution

1. Step 1: Recall correct method name in path module

   The correct method to get the directory name is dirname, all lowercase.

2. Step 2: Check method call syntax

   It is called as path.dirname(pathString), so path.dirname('/home/user/file.txt') matches exactly.

3. Final Answer:

   path.dirname('/home/user/file.txt') -> Option D

4. Quick Check:

   dirname method syntax = path.dirname('/home/user/file.txt') [OK]

Hint: Use exact method name dirname() with lowercase letters [OK]

Common Mistakes:

• Capitalizing method names incorrectly
• Using getDirName or similar incorrect names
• Misspelling dirname as dirName

3. What will be the output of the following code?

const path = require('path');
const fullPath = '/var/www/html/index.html';
console.log(path.basename(fullPath));
console.log(path.dirname(fullPath));

medium

A. index.html/var/www/html

B. /var/www/html/index.htmlindex.html

C. index/var/www/html/index.html

D. /var/www/htmlindex.html

Solution

1. Step 1: Evaluate path.basename(fullPath)

   This returns the file name with extension, which is index.html.

2. Step 2: Evaluate path.dirname(fullPath)

   This returns the folder path containing the file, which is /var/www/html.

3. Final Answer:

   index.html
   /var/www/html -> Option A

4. Quick Check:

   basename = file name, dirname = folder path [OK]

Hint: basename prints file, dirname prints folder path [OK]

Common Mistakes:

• Swapping basename and dirname outputs
• Expecting basename to return folder path
• Confusing output order

4. Identify the error in this code snippet:

const path = require('path');
const filePath = '/usr/local/bin/node';
console.log(path.baseName(filePath));
console.log(path.dirname(filePath));

medium

A. Incorrect method name 'baseName' should be 'basename'

B. Missing import of 'path' module

C. Wrong argument type passed to dirname

D. No error, code runs fine

Solution

1. Step 1: Check method names used

   The method path.baseName is incorrect because the correct method is all lowercase basename.

2. Step 2: Verify other parts

   The path module is imported correctly and dirname usage is correct, so no other errors.

3. Final Answer:

   Incorrect method name 'baseName' should be 'basename' -> Option A

4. Quick Check:

   Method names are case-sensitive [OK]

Hint: Check method name spelling and case carefully [OK]

Common Mistakes:

• Using wrong case in method names
• Assuming method names are case-insensitive
• Ignoring error messages about undefined functions

5. Given the path /home/user/docs/letter.txt, how can you use path.basename and path.dirname together to print:
Folder: /home/user/docs
File: letter.txt
Which code snippet achieves this?

hard

A. console.log(`Folder: ${path.dirname(path.basename(filePath))}`);
console.log(`File: ${path.basename(path.dirname(filePath))}`);

B. console.log(`Folder: ${path.basename(filePath)}`);
console.log(`File: ${path.dirname(filePath)}`);

C. console.log(`Folder: ${path.dirname(filePath)}`);
console.log(`File: ${path.basename(filePath)}`);

D. console.log(`Folder: ${filePath.dirname()}`);
console.log(`File: ${filePath.basename()}`);

Solution

1. Step 1: Use path.dirname to get folder path

   Calling path.dirname(filePath) returns the folder path /home/user/docs.

2. Step 2: Use path.basename to get file name

   Calling path.basename(filePath) returns the file name letter.txt.

3. Step 3: Combine in template strings for output

   Using template literals with these calls prints the desired output lines.

4. Final Answer:

   console.log(`Folder: ${path.dirname(filePath)}`); console.log(`File: ${path.basename(filePath)}`); -> Option C

5. Quick Check:

   dirname = folder, basename = file [OK]

Hint: dirname for folder, basename for file name [OK]

Common Mistakes:

• Swapping basename and dirname calls
• Trying to call basename/dirname on strings directly
• Using incorrect method chaining