angularjs - copy common properties from one object to another - javascript

I have a controller like this:
CheckoutController = function() {
$scope.Profile = {
firstname : 'Ruchir',
middlename : 'Shakun',
lastname : 'Gupta',
email : 'ruchir#example.com',
cellphone : '9876543210'
}
$scope.BillingDetails = {
firstname : undefined,
middlename : undefined,
lastname : undefined,
addressline : undefined,
city : undefined,
zipcode : undefined
}
$scope.update = function() {
// I want to write some awesome code here as explained below
}
}
Now, in the $scope.update function; I want to write something that should copy 'only common properties' i.e. firstname, middlename, and lastname from $scope.Profile to $scope.BillingDetails.
I tried angular.copy and angular.extend but,
angular.extend merges $scope.BillingDetails and $scope.Profile.
So I get email and cellphone properties in $scope.BillingDetails as
well -- what I don't want.
angular.copy overwrites
$scope.BillingDetails and I lose addressline, city and
zipcode from $scope.BillingDetails -- what I don't want.
What I want my update function to do is it should make $scope.BillingDetails equal to below object:
{
firstname : 'Ruchir',
middlename : 'Shakun',
lastname : 'Gupta',
addressline : undefined,
city : undefined,
zipcode : undefined
}
This scenario is just an example. To shorten the length of my question, I have mentioned 5-6 properties only. In fact, I have to deal with more than 20 properties and all are dynamic. So it won't work for me by copying one-by-one properties firstname, middlename and lastname from Profile to BillingDetails.
What can I do?

You may have luck with something like this:
$scope.update = function() {
_update($scope.Profile, $scope.BillingDetails);
}
function _update(srcObj, destObj) {
for (var key in destObj) {
if(destObj.hasOwnProperty(key) && srcObj.hasOwnProperty(key)) {
destObj[key] = srcObj[key];
}
}
}
plunker

Simple. Just assign them like this:
$scope.update = function() {
$scope.BillingDetails.firstname = $scope.Profile.firstname;
$scope.BillingDetails.middlename = $scope.Profile.middlename;
$scope.BillingDetails.lastname = $scope.Profile.lastname;
}
I really can't think of a more straightforward method of copying a couple of properties from one object to another.
Since you need to copy more than 3 properties, you could try this:
$scope.update = function() {
// Add the properties you want to copy to this array.
var properties = ['firstname', 'middlename', 'lastname'];
for(var i = 0; i < properties.length; i++){
$scope.BillingDetails[properties[i]] = $scope.Profile[properties[i]];
}
}
Or, pass the array as a parameter:
$scope.update = function(properties) {
for(var i = 0; i < properties.length; i++){
$scope.BillingDetails[properties[i]] = $scope.Profile[properties[i]];
}
}
$scope.update(['firstname', 'middlename', 'lastname']);

In fact, you try to update BillingDetails with values of Profile, for properties they both have in common right?
If you can change the default values of BillingDetails with null instead of undefined, you can try this code:
$scope.BillingDetails = {
firstname : null,
middlename : null,
lastname : null,
addressline : null,
city : null,
zipcode : null
}
$scope.update = function() {
for(var key in $scope.Profile) {
if(typeof $scope.BillingDetails[key] !== 'undefined') {
$scope.BillingDetails[key] = $scope.Profile[key];
}
}
}

Related

How to make object with no values given? And put a value on it with user input in javascript

We are asked to make object of person that has a properties of name, age, height with no values in it. For it to have a value we need to ask it from the user using prompt.
var person = {
name: null,
age: null,
height: null
};
/** If the properties has null values then how can I put a value in it
by getting user input? **/
Initialize the values to null to begin with. undefined would also do as well, if you're not stringifying it to JSON, otherwise it'll be removed.
var person = {
name: null,
age: null,
height: null
};
Note that checks using in to see if the key exists will still return true, so if you want to make it seem like the key doesn't exist, it's sometimes better if it literally does not exist in the object.
Try this:
var person = {
name: null ,
age: null ,
height: null
};
first create an object:
var person = {}
then you can try with it person.name = document.getElementById('name').value
then for rest you can do the same
var person = {
name:"JK",
love:"Loli!!!!!!!!!!!!!",
};
if("love" in person){
if(person["love"]=="Loli!!!!!!!!!!!!!"){
console.log("Call FBI");
}
}else{
//Do Something Input What you want like
//person["love"]=??
}
if("height" in person){
}else{
person["height"]= prompt("Enter Your Height");
}
console.log(person);
Try it don't call FBI!

Update 'nested' javascript object dynamically

I'm trying to create an object that is updated dynamically.
Here's the setup of the type of object I'd like to create (note: I may add other things, such as address, country, etc to the keys):
var contacts = {"Bruce Wayne":{"phone number":'123-456-7890', "email":"bwayne#night.com"}, "Alfred":{"phone number" :'987-654-3210', "email": "alfred#yourang.com"}, "Clark Kent":{"phone number":'951-753-8520', "email":"nothing#krypton.com"}}
So for each name (Bruce Wayne, Alfred, ...) I have some keys assigned to them.
I'm using npm faker to generate some fake data to try and populate an array like the above, with the outline
I'm able to get a loop going, but it always returns the last iteration's data. I understand it's because I'm doing contact = .... Since this is an object, I can't use push, AFAIK.
function getContact(numContacts){
contacts = {}
for (var i = 0; i < numContacts; i++){
console.log(i);
var name = faker.name.firstName() + " " + faker.name.lastName();
var phoneNum = faker.phone.phoneNumber();
var email = faker.internet.email();
contacts = {name :{ "phone number": phoneNum, "email": email}}
// contacts.name = {"phone number": phoneNum, "email":email}; // this also returns just the last instance.
};
return contacts;
};
var contacts = getContact(10); // This should create ten people, each with a phone number and email.
The loop almost successfully creates a single name. This returns:
name, 761.704.3328 x4287, Leopold81#hotmail.com
But in that iteration, name variable is actually Joe Schmoe, not literally name...
What am I overlooking to make sure that the contacts object gets populated with 10 people, with the resolved name, not just the last in the iteration?
Observations
You're trying to use name variable as key, however, what you're doing is adding a key literally called name.
What you have to do, is to create the key programmatically as follow: contacts[name] and assign the object with phoneNumber and Email.
This code is an example to simulate your scenario.
var faker = {
name: {
firstName: function() {
return "Clark";
},
lastName: function() {
return "Kent";
}
},
phone: {
phoneNumber: function() {
return '951-753-8520';
}
},
internet: {
"email": function() {
return "nothing#krypton.com";
}
}
};
function getContact(numContacts) {
var contacts = {}
for (var i = 0; i < numContacts; i++) {
var name = faker.name.firstName() + " " + faker.name.lastName();
var phoneNum = faker.phone.phoneNumber();
var email = faker.internet.email();
contacts[name + '_' + i] = {
"phone number": phoneNum,
"email": email
}
}
return contacts;
}
var contacts = getContact(10);
console.log(contacts);
The names are the keys in your object. You can use it like an array index to populate contacts. This should work:
contacts[name] = {"phone number": phoneNum, "email": email}

Adding an Object to an Array

I'm struggling on adding an Object to an Array (E-commerce context).
My "tc_vars" datalayer is mapped with another datalayer which is called "wa_data". The latter sends the requested information to the first one.
An Object in that case will be a specific product and the Array will be the cart.content property :
var tc_vars = {
nav : {
siteCategory : wa_data.nav.siteCategory,
environment :wa_data.nav.environment,
siteType :wa_data.nav.siteType,
siteName :wa_data.nav.siteName,
pageName :wa_data.nav.pageName,
siteSection :wa_data.nav.siteSection,
country :wa_data.nav.country,
language :wa_data.nav.language,
template :wa_data.nav.template,
doNotTrack :window.navigator.doNotTrack,
customReferrer :wa_data.nav.customReferrer,
genomeID :wa_data.nav.genomeID,
mdmBID :wa_data.nav.mdmBID,
mdmIID :wa_data.nav.mdmIID
},
profile : {
uplayID : readCookie("user_id"),
loginStatus : ''
},
internalSearch : {
searchStatus :wa_data.internalSearch.searchStatus,
searchFilters :wa_data.internalSearch.searchFilters,
searchKeyWord :wa_data.internalSearch.searchKeyWord,
totalResults :wa_data.internalSearch.totalResults,
resultPosition :wa_data.internalSearch.resultPosition,
autoCompletion :wa_data.internalSearch.autoCompletion
},
product : {
productID :wa_data.product.productID,
unitSalePrice :wa_data.product.unitSalePrice,
salePrice :wa_data.product.salePrice,
stockAvailability :wa_data.product.stockAvailability,
salesType :wa_data.product.salesType,
costOfGood :wa_data.product.costOfGood
},
cart : {
orderID:wa_data.cart.orderID,
cartOpen:wa_data.cart.cartOpen,
cartAdd:wa_data.cart.cartAdd,
cartRemove:wa_data.cart.cartRemove,
cartView:wa_data.cart.cartView,
checkout:wa_data.cart.checkout,
purchase:wa_data.cart.purchase,
currency:wa_data.cart.currency,
paymentMethod:wa_data.cart.paymentMethod,
orderShipping:wa_data.cart.orderShipping,
orderTotalAmountDiscounted:wa_data.cart.orderTotalAmountDiscounted,
orderTotalAmountNotDiscounted:wa_data.cart.orderTotalAmountNotDiscounted,
orderTaxAmount:wa_data.cart.orderTaxAmount,
orderDiscountedAmount:wa_data.cart.orderDiscountedAmount,
orderShippingCost:wa_data.cart.orderShippingCost,
billingRegion:wa_data.cart.billingRegion,
billingCity:wa_data.cart.billingCity,
orderStatus:wa_data.cart.orderStatus,
content : [{
productID:'',
name:'',
quantity :'',
promoCode:'',
offerID:'',
salesType:'',
platform :'',
unitSalePrice:'',
salePrice:'',
stockAvailability:'',
lineItemTotalAmountDiscounted:'',
lineItemTotalAmountNotDiscounted:'',
lineItemTaxAmount:'',
lineItemDiscountedAmount:'',
lineItemShippingCost:'',
crossSell:'',
upSell:''
}]
},
tech : {
containerVersion : wa_data.tech.containerVersion
}
}
//Scanning for the content using a loop
if (typeof tc_vars.cart.content !== 'undefined' && tc_vars.nav.pageName === 'Basket'){
for(i=0; i < tc_vars.cart.content.length; i++) {
tc_vars.cart.content[i].productID = wa_data.cart.content[i].productID;
tc_vars.cart.content[i].name = wa_data.cart.content[i].name;
tc_vars.cart.content[i].quantity = wa_data.cart.content[i].quantity;
tc_vars.cart.content[i].promoCode = wa_data.cart.content[i].promoCode;
tc_vars.cart.content[i].offerID = wa_data.cart.content[i].offerID;
tc_vars.cart.content[i].salesType = wa_data.cart.content[i].salesType;
tc_vars.cart.content[i].platform = wa_data.cart.content[i].platform;
tc_vars.cart.content[i].unitSalePrice = wa_data.cart.content[i].unitSalePrice;
tc_vars.cart.content[i].salePrice = wa_data.cart.content[i].salePrice;
tc_vars.cart.content[i].stockAvailability = wa_data.cart.content[i].stockAvailability;
tc_vars.cart.content[i].lineItemTotalAmountDiscounted = wa_data.cart.content[i].lineItemTotalAmountDiscounted;
tc_vars.cart.content[i].lineItemTotalAmountNotDiscounted = wa_data.cart.content[i].lineItemTotalAmountNotDiscounted;
tc_vars.cart.content[i].lineItemTaxAmount = wa_data.cart.content[i].lineItemTaxAmount;
tc_vars.cart.content[i].lineItemDiscountedAmount = wa_data.cart.content[i].lineItemDiscountedAmount;
tc_vars.cart.content[i].lineItemShippingCost = wa_data.cart.content[i].lineItemShippingCost;
tc_vars.cart.content[i].crossSell = wa_data.cart.content[i].crossSell;
tc_vars.cart.content[i].upSell = wa_data.cart.content[i].upSell;
}
}
The problem I'm facing here is that my code is not creating a new object for each new product that is added to the cart content (with all the dedicated properties of the new object).
I've tried using a loop which scans my cart content Array but apparently it's not working (not adding a new object inside the Array). Seems like I'm missing something.
Do you guys have any ideas?
Thx a lot
J
tc_vars.cart.content[i] is undefined. You need to define it first, before filling it up.
for(i=0; i < tc_vars.cart.content.length; i++) {
tc_vars.cart.content[i] = {}; // Creates an empty object
tc_vars.cart.content[i].productID = wa_data.cart.content[i].productID; // Starts filling it
// ....
}
As an alternative (lighter syntax and faster execution), you could also write :
for(i=0; i < tc_vars.cart.content.length; i++) {
tc_vars.cart.content[i] = {
productID : wa_data.cart.content[i].productID,
name : wa_data.cart.content[i].name,
// ....
}
}
But we don't usually add things to an Array by its index. We just push things into it :
for(i=0; i < tc_vars.cart.content.length; i++) {
tc_vars.cart.content.push({
productID : wa_data.cart.content[i].productID,
name : wa_data.cart.content[i].name,
// ....
});
}
This being said, it looks like all you're doing here is copying (not instanciating) wa_data.cart.content into tc_vars.cart.content. So you can completely forget my answer and replace your whole for loop with Gurvinder's answer (+1'd him):
tc_vars.cart.content = JSON.parse(JSON.stringify(wa_data.cart.content));
Unless wa_data already have objects repeated at all the index, following code should work
tc_vars.cart.content = JSON.parse(JSON.stringify(wa_data.cart.content));
You can use an object literal:
tc_vars.cart.content[i] = {
productID: wa_data.cart.content[i].productID,
name: wa_data.cart.content[i].name,
quantity: wa_data.cart.content[i].quantity,
promoCode: wa_data.cart.content[i].promoCode,
offerID: wa_data.cart.content[i].offerID,
salesType: wa_data.cart.content[i].salesType,
platform: wa_data.cart.content[i].platform,
unitSalePrice: wa_data.cart.content[i].unitSalePrice,
salePrice: wa_data.cart.content[i].salePrice,
stockAvailability: wa_data.cart.content[i].stockAvailability,
lineItemTotalAmountDiscounted: wa_data.cart.content[i].lineItemTotalAmountDiscounted,
lineItemTotalAmountNotDiscounted: wa_data.cart.content[i].lineItemTotalAmountNotDiscounted,
lineItemTaxAmount: wa_data.cart.content[i].lineItemTaxAmount,
lineItemDiscountedAmount: wa_data.cart.content[i].lineItemDiscountedAmount,
lineItemShippingCost: wa_data.cart.content[i].lineItemShippingCost,
crossSell: wa_data.cart.content[i].crossSell,
upSell: wa_data.cart.content[i].upSell
}

JavaScript / AngularJS modify property in array

I have the following AngularJS model:
$scope.Model = {
Users : [{
UserId: '',
FirstName: '',
LastName: ''
}],
Products :[{
ProductId: '',
Price: ''
}]
};
If I populate this array with N users, and one user has id=1, how can I update that specific user (with id=1) the property LastName?
So for example if I will get a new AngularJS model:
$scope.UserToUpdate ={
UserId: 1,
LastName: "Smith"
};
I want to loop through the $scope.Model array and update the user with id=1 but only the FirstName property.
P.S. I don't know at what position the target user object in the array it is so basically can be at $scope.Model.Users[0] or $scope.Model.Users[1] or $scope.Model.Users[10] or at $scope.Model.Users[N] ...
You can just loop through your list of users
for (var i = 0; i < $scope.Model.Users.length; i++) {
if($scope.Model.Users[i].UserId === $scope.UserToUpdate.UserId) {
$scope.Model.Users[i].LastName = $scope.UserToUpdate.LastName;
break;
}
}
EDIT: Actually harish's answer is on to something too. Here's another solution using $filter:
var matchedUsers = $filter('filter')($scope.Model.Users, { UserId: $scope.UserToUpdate.UserId });
if (matchedUsers.length > 0) {
matchedUsers[0].LastName = $scope.UserToUpdate.LastName;
}
And don't forget to add the $filter service as a parameter in your controller declaration for this second solution.
$scope.UserToUpdate =
$scope.Model.Users.filter(function(user) { return user.FirstName == "test"; })[0];
BTW: you can add a check if the user exists..
you can use $filter
var user = $filter('filter')($scope.Model.Users, 'UserId == 1');
you are read more about $filter('filter') here
Try this! working demo http://plnkr.co/edit/scyV79HqqA7nOG9h4ezH?p=preview . Please check the console log.
angular.forEach($scope.Model[0].Users, function(value1, key1) {
var i = 0;
angular.forEach(value1, function(value, key) {
if (key == 'UserId' && $scope.UserToUpdate.UserId == value) {
$scope.Model[0].Users[i].LastName = $scope.UserToUpdate.LastName;
}
i++;
});
});
The above code updating the Model object LastName property based on UserToUpdate object (id=1)

Look for a value for a given key in JSON and change the value using javascript

I am looking to write a function which can look up a value based on a key and replace that value with another. The key is a tree from the start node of JSON. Here is the example.
var myData = {
name : 'Dan',
address: {
city : 'Santa Clara',
details : {
'prevhouse' : ''
}
}
}
Input to the function is a key tree. For eg, myData-address-details-prevhouse
When I pass this key with a new value, say 'Texas', the prevhouse value will get changed to the new value I am sending.
and new JSON will be
var myData = {
name : 'Dan',
address: {
city : 'Santa Clara',
details : {
'prevhouse' : 'Texas'
}
}
}
Here is what I wrote so far
var tree = key.split("-");
now the tree variable contains ["myData","address", "details","prevhouse"]
I know that we can access the object using myData[tree[0]][tree[1]][tree[2]], but somehow not able to get it dynamic from parsed value.
how do we generate this dynamically since the length of the depth is not known till runtime.
Hope to get a help.
try with this code:
var myData = {
name: 'Dan',
address: {
city: 'Santa Clara',
details: {
prevhouse: ''
}
}
};
function setAttribute(obj, key, value) {
var i = 1,
attrs = key.split('-'),
max = attrs.length - 1;
for (; i < max; i++) {
attr = attrs[i];
obj = obj[attr];
}
obj[attrs[max]] = value;
console.log('myData=', myData);
}
setAttribute(myData, "myData-address-details-prevhouse", "Texas");
here a working jsfiddle demo; see the console for the result
You should be able to iterate through each key because your JSON is just a JS object. So go through each key, check if it's defined, if it is, use that object for your next check. That'll get you where you want to go. Keep in mind you'll be setting the last key to your value.
basic psuedo-code without dealing with setting:
obj = data;
for (key in keys) {
obj = obj[key]
}
Something like this would do:
function update(node, path, value) {
path = path.split('-');
do {
node = node[path.splice(0, 1)];
} while(path.length > 1);
node[path[0]] = value;
}
Given that myData is the object, I think you should be using myData[tree[1]][tree[2]][tree[3]] and throwing away the first item in the array.
Something like this should work recursively (untested)
function updateValue(obj, key, value)
{
var keys = key.split('-');
updateObjectValue(obj, keys.shift(), value);
}
function updateObjectValue(obj, keyArray, value)
{
if (keyArray.length == 1) {
obj[keyArray[0]] = value;
}
else if (keyArray.length > 1) {
updateObject(obj[keyArray[0]], keyArray.shift(), value);
}
}

Categories