Article Categories
- All Categories
-
Data Structure
-
Networking
-
RDBMS
-
Operating System
-
Java
-
MS Excel
-
iOS
-
HTML
-
CSS
-
Android
-
Python
-
C Programming
-
C++
-
C#
-
MongoDB
-
MySQL
-
Javascript
-
PHP
-
Economics & Finance
How much should be a JavaScript Line Length?
JavaScript line length refers to how many characters should fit on a single line of code. Following proper line length guidelines makes your code more readable and maintainable.
Recommended Line Length
The standard practice is to keep JavaScript lines under 80 characters. Some modern style guides allow up to 100 or 120 characters, but 80 remains the most widely adopted standard for better readability across different editors and devices.
Breaking Long Lines
When a statement exceeds the character limit, break it after a comma or operator, not in the middle of a variable name or string.
Example: Proper Line Breaking
<!DOCTYPE html>
<html>
<head>
<title>Line Length Example</title>
</head>
<body>
<div id="test"></div>
<script>
function display() {
var a = "";
// Break after operators for better readability
a = a + isNaN(6234) + ": 6234<br>";
a = a + isNaN(-52.1) + ": -52.1<br>";
a = a + isNaN('') + ": ''<br>";
document.getElementById("test").innerHTML = a;
}
display();
</script>
</body>
</html>
false: 6234 false: -52.1 true: ''
Best Practices for Line Breaking
Break after operators:
// Good - break after operator
let result = firstValue +
secondValue +
thirdValue;
// Bad - break before operator
let result = firstValue
+ secondValue
+ thirdValue;
Break after commas in function parameters:
// Good
function processData(firstName, lastName,
emailAddress, phoneNumber) {
// function body
}
// Better - align parameters
function processData(firstName, lastName,
emailAddress, phoneNumber) {
// function body
}
Modern Considerations
While 80 characters remains popular, many teams now use:
- 100 characters - Good balance for modern monitors
- 120 characters - Used by some large codebases
- Prettier default - 80 characters with automatic formatting
Tools for Enforcement
Use linters like ESLint to automatically enforce line length rules:
// .eslintrc.json
{
"rules": {
"max-len": ["error", { "code": 80 }]
}
}
Conclusion
Keeping JavaScript lines under 80 characters improves code readability and collaboration. Break long lines after operators or commas, and consider using automated tools to maintain consistency across your codebase.
833 Views
