Develop Reference

i want to skip last property in object and assign its value to previous property

I have one object like below
let a = {
title: {
value:"developer"
}
publishedOn:{
month:{
value:"jan"
}
year:{
value:"2000"
}
}
and i want to convert it like below object
let b = {
title : "Developer"
publishedOn:{
month:"jan",
year:"2000"
}
}
Constrains are we don't know what properties are inside a variable
I have tried iterative method and i though its not the better way
please help me for better solution
function set(path, value) {
var schema = obj;
var pList = path.split('.');
var len = pList.length;
for(var i = 0; i < len-1; i++) {
var elem = pList[i];
if( !payload[elem] ) payload[elem] = {}
payload = payload[elem];
}
payload[pList[len-1]] = value;
console.log(payload);
}
Object.keys(this.formObject).forEach((key)=> {
if (Object.prototype.hasOwnProperty.call(this.formObject, key)) {
this.getPath(this.formObject[key],key).then((data:any)=>{
set(data.path, data.value);
});
}
});
}
async getPath(obj,path) { //publishedOn , month, yeaer
let value = "";
Object.keys(obj).forEach((key)=> {//month
if (Object.prototype.hasOwnProperty.call(obj, key)) {
if(key === "value"){
path = path;
value = obj[key]
}else{
path = path + "." + key; // publishedOn.month
value = obj[key]['value']; // june
}
}
});
return {path,value }
}

You could look ahead for a coming object and take the final value.
function omitLast(object) {
return Object.fromEntries(Object.entries(object).map(([key, value]) => [
key,
Object.values(value).every(item => item && typeof item === 'object')
? omitLast(value)
: Object.values(value)[0]
]));
}
let input = { title: { value: "developer" }, publishedOn: { month: { value: "jan" }, year: { value: "2000" } } };
result = omitLast(input);
console.log(result);
For old browsers.
function omitLast(object) {
return Object.keys(object).reduce(function (r, key) {
r[key] = Object.keys(object[key]).every(function (k) { return object[key][k] && typeof object[key][k] === 'object'; })
? omitLast(object[key])
: object[key][Object.keys(object[key])[0]];
return r;
}, {});
}
let input = { title: { value: "developer" }, publishedOn: { month: { value: "jan" }, year: { value: "2000" } } };
result = omitLast(input);
console.log(result);

WebComponents - Attribute Changed

From the link qr-code.js I have the code below.
Then I don't understand, on the highlighted line (60), what means the suffix: "Changed"?
attributeChangedCallback: {
value: function (attrName, oldVal, newVal) {
var fn = this[attrName+'Changed'];
if (fn && typeof fn === 'function') {
fn.call(this, oldVal, newVal);
}
this.generate();
}
Also I don't understand the usage of:
this[attrName+'Changed']
Could you explain me this?, I don't find any clear explanation about this on Google. Thanks.
Below is the full code:
'use strict';
(function(definition) {
if (typeof define === 'function' && define.amd) {
define(['QRCode'], definition);
} else if (typeof module === 'object' && module.exports) {
var QRCode = require('qrjs');
module.exports = definition(QRCode);
} else {
definition(window.QRCode);
}
})(function(QRCode) {
//
// Prototype
//
var proto = Object.create(HTMLElement.prototype, {
//
// Attributes
//
attrs: {
value: {
data: null,
format: 'png',
modulesize: 5,
margin: 4
}
},
defineAttributes: {
value: function () {
var attrs = Object.keys(this.attrs),
attr;
for (var i=0; i<attrs.length; i++) {
attr = attrs[i];
(function (attr) {
Object.defineProperty(this, attr, {
get: function () {
var value = this.getAttribute(attr);
return value === null ? this.attrs[attr] : value;
},
set: function (value) {
this.setAttribute(attr, value);
}
});
}.bind(this))(attr);
}
}
},
//
// LifeCycle Callbacks
//
createdCallback: {
value: function () {
this.createShadowRoot();
this.defineAttributes();
this.generate();
}
},
attributeChangedCallback: {
value: function (attrName, oldVal, newVal) {
var fn = this[attrName+'Changed'];
if (fn && typeof fn === 'function') {
fn.call(this, oldVal, newVal);
}
this.generate();
}
},
//
// Methods
//
getOptions: {
value: function () {
var modulesize = this.modulesize,
margin = this.margin;
return {
modulesize: modulesize !== null ? parseInt(modulesize) : modulesize,
margin: margin !== null ? parseInt(margin) : margin
};
}
},
generate: {
value: function () {
if (this.data !== null) {
if (this.format === 'png') {
this.generatePNG();
}
else if (this.format === 'html') {
this.generateHTML();
}
else if (this.format === 'svg') {
this.generateSVG();
}
else {
this.shadowRoot.innerHTML = '<div>qr-code: '+ this.format +' not supported!</div>'
}
}
else {
this.shadowRoot.innerHTML = '<div>qr-code: no data!</div>'
}
}
},
generatePNG: {
value: function () {
try {
var img = document.createElement('img');
img.src = QRCode.generatePNG(this.data, this.getOptions());
this.clear();
this.shadowRoot.appendChild(img);
}
catch (e) {
this.shadowRoot.innerHTML = '<div>qr-code: no canvas support!</div>'
}
}
},
generateHTML: {
value: function () {
var div = QRCode.generateHTML(this.data, this.getOptions());
this.clear();
this.shadowRoot.appendChild(div);
}
},
generateSVG: {
value: function () {
var div = QRCode.generateSVG(this.data, this.getOptions());
this.clear();
this.shadowRoot.appendChild(div);
}
},
clear: {
value: function () {
while (this.shadowRoot.lastChild) {
this.shadowRoot.removeChild(this.shadowRoot.lastChild);
}
}
}
});
//
// Register
//
document.registerElement('qr-code', {
prototype: proto
});
});

As #Jhecht suggested, it's a combination of the name of a attribute and the suffix "Changed" in order to create generic method names.
For example if the <qr-code> element has an attribute "foo" that is added, updated or removed, then the callback will define the fn variable to this["fooChanged"], which is equivalent to this.fooChanged.
If this method exists, it will be invoked by fn.call().
However I see nowhere in the code you posted such method signature attached to the custom element prototype, so it's useless code until further notice.

Retrieve Path of Object items

I'm wondering if its possible to retrieve all paths a javascript object contains
Example:
obj = {
prop1 : {
x: 19
y: 43
}
prop2 : {
another: {
here: 1
}
}
prop3: "hello"
}
Where the result would be an array with following elements:
Result: ["prop1.x", "prop1.y", "prop2.another.here", "prop3"]
Is this possible?
Thanks!

function flattenKeys(obj, delimiter) {
delimiter = delimiter || '.';
return recurse(obj, '', []);
function recurse(obj, path, result) {
if (typeof obj === "object") {
Object.keys(obj).forEach(function (key) {
recurse(obj[key], path + delimiter + key, result);
});
} else {
result.push(path.slice(delimiter.length));
}
return result;
}
}
used as
var obj = {
prop1 : {
x: 19,
y: 43
},
prop2 : {
another: {
here: 1
}
},
prop3: "hello"
};
flattenKeys(obj);
// -> ["prop1.x", "prop1.y", "prop2.another.here", "prop3"]
Alternative implementation without string operations:
function flattenKeys(obj, delimiter) {
delimiter = delimiter || '.';
return recurse(obj, [], []);
function recurse(obj, path, result) {
if (typeof obj === "object") {
Object.keys(obj).forEach(function (key) {
path.push(key);
recurse(obj[key], path, result);
path.pop();
});
} else {
result.push(path.join(delimiter));
}
return result;
}
}

Wrote this while Tomalak was putting together here. Recursion's the obvious approach for doing this.
var inputObject = {
prop1: {
x: 19,
y: 43
},
prop2: {
another: {
here: 1
}
},
prop3: "hello"
};
function getProps(obj) {
var props = [];
var findPropsRecursive = function (robj, str) {
robj = robj || {};
var keys = Object.keys(robj);
if (keys.length > 0 && (robj instanceof Object)) {
return keys.map(function (key) {
return findPropsRecursive(robj[key], str + (str ? '.' : '') + key);
});
} else {
props.push(str);
return '';
}
};
findPropsRecursive(obj, '');
return props;
}
console.log(getProps(inputObject));
on jsfiddle: http://jsfiddle.net/jkoudys/w49rcp40/

JS find key value pair in encapsulated object

I have a big problem and I need your help.
I have a object like this:
{
folder1: {
folderid: 1,
files: {
name: "yeah.txt"
},
folder2: {
folderid: 2
folder3: {
folderid: 3
}
}
},
folder4: {
folderid: 4
}
}
and I want to search for the key "folderid = 3" and find the object.
How can I do this in JavaScript?
Kind regards and thanks for your help

I came to a more generalised solution, that supports multiple properties check:
function search(obj, properties){
if(Object.keys(properties).every(function(key){
return obj[key] === properties[key];
})) {
return obj;
} else {
Object.keys(obj).forEach(function(key){
var child = obj[key];
if(child !== null && typeof child === 'object'){
return search(child, properties);
}
});
return false;
}
}
demo: http://jsfiddle.net/dzs1orbw/

You can use a DSF algorithm to do this: http://jsfiddle.net/L5b07bt6/
var obj = {
folder1: {
folderid: 1,
files: {
name: "yeah.txt"
},
folder2: {
folderid: 2,
folder3: {
folderid: 3,
caption: "I got it!"
}
}
},
folder4: {
folderid: 4
}
};
function find(root, id) {
if (root.folderid == id) return root;
if (typeof root !== 'object') return null;
var key, val;
for (key in root) {
val = find(root[key], id);
if (val != null) return val;
}
return null;
}
var result = find(obj, 3);
if (!result) alert("Not found!");
else alert("Found: " + result.caption);

and here another one:
function findByKey (object, searchKey){
if(typeof object !== 'object'){
return false;
}
for(var key in object){
if(object[key] === searchKey){
return object;
} else {
if(typeof (object[key] === 'object')){
var result = findByKey(object[key], searchKey);
if(result){
return result;
}
}
}
}
}
http://jsfiddle.net/mattposch/ebmd8xtk/

Javascript, simple extension method that allows multiple versions of extending object

I have a straightforward "extend" method set up like this:
extend: function(source) {
for (var k in source) {
if (source.hasOwnProperty(k)) {
myThing[k] = source[k];
}
}
return myThing;
}
You use it like
myThing.extend({
newObj: {
myFunc: function () { console.log('things'); }
}
});
and it works great.
However, I would love to add the ability to have some other piece of code call this LATER:
myThing.extend({
newObj: {
mySecondFunc: function () { console.log('things'); }
}
});
and I should be able to call both myThing.newObj.myFunc() AND myThing.newObj.mySecondFunc().
I tried changing it to this:
for (var k in source) {
if (source.hasOwnProperty(k)) {
if (mtUtils.hasOwnProperty(k)) {
for (var t in k) {
mtUtils[k][t] = source[k][t];
}
} else {
mtUtils[k] = source[k];
}
}
}
but that doesn't seem to work.

function extend(dest, source) {
for (var k in source) {
if (source.hasOwnProperty(k)) {
var value = source[k];
if (dest.hasOwnProperty(k) && typeof dest[k] === "object" && typeof value === "object") {
extend(dest[k], value);
} else {
dest[k] = value;
}
}
}
return dest;
}
var myThing = {};
extend(myThing, {
newObj: {
myFunc: function() {
console.log('things');
}
}
});
extend(myThing, {
newObj: {
mySecondFunc: function() {
console.log('things');
}
}
});
myThing;
/*
Object
newObj: Object
myFunc: function () { console.log('things'); }
mySecondFunc: function () { console.log('things'); }
__proto__: Object
__proto__: Object
*/

This should fix your problem, but why not implement a recursive version of extend?
for (var k in source) {
if (source.hasOwnProperty(k)) {
if (mtUtils.hasOwnProperty(k)) {
for (var t in source[k]) {
mtUtils[k][t] = source[k][t];
}
} else {
mtUtils[k] = source[k];
}
}
}