Quick Answer

JSON string has invalid syntax. Check for proper quotes, no trailing commas, escaped characters, and valid JSON format. Use JSON.parse() with try-catch.

Understanding the Issue

JSON parsing errors occur when the string being parsed does not conform to valid JSON syntax. Common issues include single quotes instead of double quotes, trailing commas, unescaped characters, undefined values, functions, or comments. JSON is stricter than JavaScript object literals. Proper error handling and JSON validation are essential for robust applications that process external data.

The Problem

This code demonstrates the issue:

Javascript Error 
// Problem 1: Invalid JSON syntax
const invalidJson1 = "{name: 'John', age: 30}"; // Single quotes, unquoted keys
const invalidJson2 = '{"name": "John", "age": 30,}'; // Trailing comma
const invalidJson3 = '{"name": "John", "comment": "He said \"Hello\""}'; // Unescaped quotes

try {
    const data1 = JSON.parse(invalidJson1); // SyntaxError
} catch (error) {
    console.log("Error 1:", error.message);
}

try {
    const data2 = JSON.parse(invalidJson2); // SyntaxError
} catch (error) {
    console.log("Error 2:", error.message);
}

The Solution

Here's the corrected code:

Javascript Fixed 
// Solution 1: Correct JSON formatting
const validJson1 = '{"name": "John", "age": 30}'; // Double quotes, no trailing comma
const validJson2 = '{"name": "John", "comment": "He said \"Hello\""}'; // Escaped quotes
const validJson3 = '{"items": [1, 2, 3], "active": true, "data": null}'; // Valid values

try {
    const data1 = JSON.parse(validJson1);
    const data2 = JSON.parse(validJson2);
    const data3 = JSON.parse(validJson3);
    
    console.log("Valid data 1:", data1);
    console.log("Valid data 2:", data2);
    console.log("Valid data 3:", data3);
} catch (error) {
    console.error("Parsing error:", error.message);
}

// Solution 2: Safe JSON parsing function
function safeJsonParse(jsonString, defaultValue = null) {
    try {
        return JSON.parse(jsonString);
    } catch (error) {
        console.error("JSON parse error:", error.message);
        console.error("Invalid JSON:", jsonString);
        return defaultValue;
    }
}

// Test with various inputs
const testCases = [
    '{"valid": true}',
    '{invalid: json}',
    '{"trailing": "comma",}',
    '{"valid": "array", "items": [1, 2, 3]}'
];

testCases.forEach((testCase, index) => {
    const result = safeJsonParse(testCase, { error: true });
    console.log(`Test ${index + 1}:`, result);
});

// Solution 3: JSON validation before parsing
function isValidJson(str) {
    try {
        JSON.parse(str);
        return true;
    } catch (error) {
        return false;
    }
}

function validateAndParse(jsonString) {
    if (typeof jsonString !== 'string') {
        return { success: false, error: "Input is not a string" };
    }
    
    if (!isValidJson(jsonString)) {
        return { success: false, error: "Invalid JSON format" };
    }
    
    try {
        const data = JSON.parse(jsonString);
        return { success: true, data };
    } catch (error) {
        return { success: false, error: error.message };
    }
}

// Test validation
const testInputs = [
    '{"name": "Alice", "age": 25}',
    '{name: "Bob"}',
    '{"valid": true, "list": [1, 2, 3]}'
];

testInputs.forEach(input => {
    const result = validateAndParse(input);
    console.log("Validation result:", result);
});

Key Takeaways

Always use try-catch when parsing JSON to handle invalid format errors. JSON.parse() converts strings to JavaScript objects. Use double quotes for JSON strings and property names. Remove trailing commas.