diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..80a4fe4 --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,14 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "node", + "request": "launch", + "name": "Launch Program", + "program": "${workspaceFolder}\\utils.js" + } + ] +} \ No newline at end of file diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..a7f6541 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,5 @@ +{ + "editor.glyphMargin": false, + "editor.folding": false, + "scm.diffDecorations": "none" +} \ No newline at end of file diff --git a/README.md b/README.md index 9c47b05..23e3e29 100644 --- a/README.md +++ b/README.md @@ -1,2 +1,2 @@ # JavaScript Objects, Prototypes and Classes -This is a demo code for the Pluralsight course at https://app.pluralsight.com/courses/javascript-objects-prototypes-and-classes +This is the demo code for the Pluralsight course at https://app.pluralsight.com/courses/javascript-objects-prototypes-and-classes diff --git a/demo.js b/demo.js index 9ce4206..ee72de3 100644 --- a/demo.js +++ b/demo.js @@ -1,3 +1,6 @@ -'use strict'; +'use strict'; +(function() { -display('Hello, world!!!'); \ No newline at end of file + + +})(); \ No newline at end of file diff --git a/utils.js b/utils.js index f31934f..498d209 100644 --- a/utils.js +++ b/utils.js @@ -10,6 +10,12 @@ window.display = function () { domActionBuffer.push({ action: 'display', arguments: arguments }); }; +window.displayRegexArray = function () { + if (!flushTimeout) flushTimeout = setTimeout(flushDomQueue, 100); + + domActionBuffer.push({ action: 'displayRegexArray', arguments: arguments }); +}; + window.clearDisplay = function () { if (!flushTimeout) flushTimeout = setTimeout(flushDomQueue, 100); @@ -25,11 +31,15 @@ function doClearDisplay() { function doDisplay() { for (var i = 0; i < arguments.length; i++) { - if (typeof arguments[i] === 'object') displayObject(arguments[i]); + if (typeof arguments[i] === 'object') displayObject(arguments[i], false); else displayValue(arguments[i], true); } } +function doDisplayRegexArray() { + displayObject(arguments[0], true) +} + function flushDomQueue() { flushTimeout = null; @@ -42,6 +52,9 @@ function flushDomQueue() { case 'display': doDisplay(...domAction.arguments); break; + case 'displayRegexArray': + doDisplayRegexArray(...domAction.arguments); + break; case 'clearDisplay': doClearDisplay(); break; @@ -59,12 +72,36 @@ function displayValue(value, addMargin, addPadding) { outputTag.appendChild(div); } -function displayObject(object) { +function displayObject(object, regexArray) { if (object == null) return displayValue('null'); + if (getTypeName(object) === 'Array' && !regexArray) { + let appendedArrayValues = object.reduce((acc, cur) => acc+=cur+',', '') + if (appendedArrayValues.length > 0) + appendedArrayValues = appendedArrayValues.substr(0, appendedArrayValues.length - 1) + displayValue('[' + appendedArrayValues + ']') + if (Object.keys(object).length > object.length) { + displayValue(' ') + displayValue('Additional array properties:') + } + for (let propertyName in object) + { + if (!Number.isInteger(+propertyName) && object[propertyName] !== undefined) + displayValue('  ' + propertyName + ": " + object[propertyName]) + else if (typeof object[propertyName] === 'object', false) { + return displayObject() + } + } + return + } + displayValue(getTypeName(object) + ' {'); for (var propertyName in object) { - if (propertyName != 'constructor') { - displayValue(propertyName + ': ' + object[propertyName], false, true); + if (typeof object[propertyName] === 'object', false) + displayObject(object[propertyName]) + else if (propertyName != 'constructor' && (!regexArray || object[propertyName] !== undefined)) { + let prefix = Number.isInteger(+propertyName) && regexArray ? '[' : '' + let suffix = Number.isInteger(+propertyName) && regexArray ? ']' : '' + displayValue(prefix + propertyName + suffix + ': ' + object[propertyName], false, true); } } displayValue('}', true);