Skip to content

Instantly share code, notes, and snippets.

@The-Quill

The-Quill/non_strict_mode.html

Created July 30, 2016 17:35
Show Gist options
  • Save The-Quill/4c3bc6d63989f46f1d16847fd9710365 to your computer and use it in GitHub Desktop.
Save The-Quill/4c3bc6d63989f46f1d16847fd9710365 to your computer and use it in GitHub Desktop.
Download ZIP
Strict vs non-strict mode comparisons
Raw
non_strict_mode.html
<!DOCTYPE html>
<html>
<head>
<style>
tbody td:not(.title) {
border: 1px solid black;
}
</style>
</head>
<body>
<br />
<table id="table">
<thead>
<tr>
</tr>
</thead>
<tbody>
<tbody>
</table>
<script>
var nonStrictMode = {}
var table = document.getElementById('table');
var list = ['true', 'false', '1', '0', '-1', '"true"', '"false"', '"1"', '"0"', '"-1"', '""', 'null', 'undefined', 'Infinity', '-Infinity', '[]' , '({})', '[[]]', '[0]', '[1]', 'NaN']
list.forEach(item => { nonStrictMode[`'${item}'`] = {}});
list.forEach(item => list.forEach(item2 => { nonStrictMode[`'${item}'`][`'${item2}'`] = eval(`${item} == ${item2}`) }))
var paddedList = [' '].concat(list);
paddedList.forEach(item => {
var data = document.createElement('td');
data.innerText = item;
data.style.transform = 'rotate(90deg)'
table.querySelector('thead tr').appendChild(data);
})
list.forEach(item => {
var row = document.createElement('tr');
var info = document.createElement('td');
info.innerText = item;
info.classList.add('title')
row.appendChild(info);
list.forEach(item2 => {
var data = document.createElement('td');
data.style.backgroundColor = nonStrictMode[`'${item}'`][`'${item2}'`] ? 'green' : 'white'
row.appendChild(data);
})
table.querySelector('tbody').appendChild(row)
})
</script>
</body>
</html>
Raw
strict_mode.html
<!DOCTYPE html>
<html>
<head>
<style>
tbody td:not(.title) {
border: 1px solid black;
}
</style>
</head>
<body>
<br />
<table id="table">
<thead>
<tr>
</tr>
</thead>
<tbody>
<tbody>
</table>
<script>
var nonStrictMode = {}
var table = document.getElementById('table');
var list = ['true', 'false', '1', '0', '-1', '"true"', '"false"', '"1"', '"0"', '"-1"', '""', 'null', 'undefined', 'Infinity', '-Infinity', '[]' , '({})', '[[]]', '[0]', '[1]', 'NaN']
list.forEach(item => { nonStrictMode[`'${item}'`] = {}});
list.forEach(item => list.forEach(item2 => { nonStrictMode[`'${item}'`][`'${item2}'`] = eval(`${item} === ${item2}`) }))
var paddedList = [' '].concat(list);
paddedList.forEach(item => {
var data = document.createElement('td');
data.innerText = item;
data.style.transform = 'rotate(90deg)'
table.querySelector('thead tr').appendChild(data);
})
list.forEach(item => {
var row = document.createElement('tr');
var info = document.createElement('td');
info.innerText = item;
info.classList.add('title')
row.appendChild(info);
list.forEach(item2 => {
var data = document.createElement('td');
data.style.backgroundColor = nonStrictMode[`'${item}'`][`'${item2}'`] ? 'green' : 'white'
row.appendChild(data);
})
table.querySelector('tbody').appendChild(row)
})
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment