Interactive Code Playground
Experience algorithms and data structures in action with this live JavaScript execution environment.
// Binary Search Tree Implementation
class TreeNode {
constructor(value) {
this.value = value
this.left = null
this.right = null
}
}
class BinarySearchTree {
constructor() {
this.root = null
}
insert(value) {
const newNode = new TreeNode(value)
if (!this.root) {
this.root = newNode
return this
}
let current = this.root
while (true) {
if (value === current.value) return this
if (value < current.value) {
if (!current.left) {
current.left = newNode
return this
}
current = current.left
} else {
if (!current.right) {
current.right = newNode
return this
}
current = current.right
}
}
}
find(value) {
let current = this.root
while (current) {
if (value === current.value) return true
if (value < current.value) {
current = current.left
} else {
current = current.right
}
}
return false
}
inOrderTraversal(node = this.root, result = []) {
if (node) {
this.inOrderTraversal(node.left, result)
result.push(node.value)
this.inOrderTraversal(node.right, result)
}
return result
}
getHeight(node = this.root) {
if (!node) return -1
return 1 + Math.max(this.getHeight(node.left), this.getHeight(node.right))
}
}
// Example usage
const bst = new BinarySearchTree()
const values = [10, 5, 15, 3, 7, 12, 20]
console.log('Inserting values:', values)
values.forEach(val => bst.insert(val))
console.log('\nIn-order traversal:', bst.inOrderTraversal())
console.log('Tree height:', bst.getHeight())
console.log('\nSearching for values:')
console.log('Find 7:', bst.find(7))
console.log('Find 9:', bst.find(9))
console.log('Find 15:', bst.find(15))
Key Features
- Real-time Execution: See your code run instantly in the browser
- Console Output Capture: All console.log statements are displayed below
- Error Handling: Graceful error messages for debugging
- Editable Code: Modify and experiment with the algorithms
Example Algorithms
Monte Carlo Simulation
// Monte Carlo estimation of Pi
function estimatePi(iterations = 100000) {
let insideCircle = 0
for (let i = 0; i < iterations; i++) {
const x = Math.random()
const y = Math.random()
if (x * x + y * y <= 1) {
insideCircle++
}
}
return 4 * insideCircle / iterations
}
console.log('Estimating Pi using Monte Carlo method...')
console.log(`10,000 iterations: ${estimatePi(10000)}`)
console.log(`100,000 iterations: ${estimatePi(100000)}`)
console.log(`Actual value of Pi: ${Math.PI}`)
Sorting Algorithm Visualization
// Quick Sort Implementation with Step Tracking
function quickSort(arr, steps = []) {
if (arr.length <= 1) return arr
const pivot = arr[Math.floor(arr.length / 2)]
const left = arr.filter(x => x < pivot)
const middle = arr.filter(x => x === pivot)
const right = arr.filter(x => x > pivot)
steps.push(`Pivot: ${pivot}, Left: [${left}], Right: [${right}]`)
return [...quickSort(left, steps), ...middle, ...quickSort(right, steps)]
}
const array = [64, 34, 25, 12, 22, 11, 90]
const steps = []
console.log(`Original array: [${array}]`)
const sorted = quickSort(array, steps)
console.log('\nSorting steps:')
steps.forEach((step, i) => console.log(`Step ${i + 1}: ${step}`))
console.log(`\nSorted array: [${sorted}]`)
Technical Implementation
This playground is built with:
- Svelte for reactive UI components
- AST Validation with Acorn for security
- Sandboxed iframe execution for safe code running
- Real-time console capture for immediate feedback
- Syntax highlighting with Prism.js
Try modifying the code above or write your own algorithms to see them in action!