Hey guys I'm currently working on a JSDares challenge that I just can't seem to wrap my head around.
Here's the link, it's called "More Information":
https://jsdares.com/?dare=300000000000000000000109
Here is the code I currently have:
function person(name, born, died, knownFor) {
if(died == 0) {
console.log("Name : " + name);
console.log("Born in : " + born);
console.log("Known for : " + knownFor);
console.log("");
} else {
console.log("Name : " + name);
console.log("Born in : " + born);
console.log("Died in : " + died);
console.log("Known for : " + knownFor);
console.log("");
}
}
console.log("Famous people in computing:");
console.log("");
person("Charles Babbage", 1815, 1871, "first computer");
person("Ada Lovelace", 1815, 1852, "first programmer");
person("George Boole", 1815, 1864, "Boolean logic");
person("Grace Hopper", 1906, 1992, "first language");
person("Alan Turing", 1912, 1954, "Turing machine");
person("Douglas Engelbart", 1925, 0, "Computer mouse");
person("Bill Gates", 1955, 0, "Microsoft");
person("Steve Jobs", 1955, 2011, "Apple");
person("Linus Torvalds", 1969, 0, "Linux");
person("Tim Berners-Lee", 1955, 0, "World Wide Web");
console.log("And many more...");
What I can't seem to figure out is how to reduce the amount of lines I'm using. When I use an IF statement, inside the function, I end up writing a CONSOLE.LOG for every PARAMETER and I can't seem to find an operator or method that will exclude the "DIED" parameter in the ELSE part of the statement. Any tips?
You don't need to use your if statement for the entire function, but only for one line. I've fix your code in the example below, and also tested it on your submission website:
function person(name, born, died, knownFor) {
console.log("Name : " + name);
console.log("Born in : " + born);
if (died != 0) {
console.log("Died in : " + died);
}
console.log("Known for : " + knownFor);
console.log("");
}
console.log("Famous people in computing:");
console.log("");
person("Charles Babbage", 1815, 1871, "first computer");
person("Ada Lovelace", 1815, 1852, "first programmer");
person("George Boole", 1815, 1864, "Boolean logic");
person("Grace Hopper", 1906, 1992, "first language");
person("Alan Turing", 1912, 1954, "Turing machine");
person("Douglas Engelbart", 1925, 0, "Computer mouse");
person("Bill Gates", 1955, 0, "Microsoft");
person("Steve Jobs", 1955, 2011, "Apple");
person("Linus Torvalds", 1969, 0, "Linux");
person("Tim Berners-Lee", 1955, 0, "World Wide Web");
console.log("And many more...");
Related
i have a grouped array that i want to render on the front end via PUG and it's proving a little tricky
here's the array
{
"Apr 14th 19": {
"5:00 PM": [
{
"name": "John",
"message": "Hey there"
},
{
"name": "Josh",
"message": "Hey"
}
]
},
"Apr 15th 19": {
"5:00 PM": [
{
"name": "Jake",
"message": "Hey you"
}
]
}
}
here is my pug code that im trying to use to render the kind of template i want (desired output below)
each day in Data
each hour in day
each entry in hour
h2= "The date is" + Object.keys(day)
h2= "The time is" + Object.keys(hour)
h2= "The message is" + entry.message
the kind of template output i want
The date is Apr 14th 19
The time is 5:00 pm
The message is : Hey
The message is : Hey you
(Both messages here because those are 2 nested under under the times)
none of this actually works, i can really use some help
You'll want to do something along these lines within your Pug template:
each dayObj, day in Data
h2= "The date is " + day
each hourObj, hour in dayObj
h2= "The time is " + hour
each entry in hourObj
h2= "The message is : " + entry.message
Here's a working Pen: https://codepen.io/chanceaclark/pen/JVpmMd
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Quote generator</title>
<link rel="stylesheet" href="css/styles.css">
</head>
<body>
<h1 class = "quotes">Quotes</h1>
<img src ="https://placeimg.com/1100/300/nature" alt="nature" class="nature">
<div id = "output">
</div>
<script type ="text/javascript" src="js/student_report.js"></script>
<button onclick="print(blank)">Click me</button>
</body>
</html
> Blockquote
function print(message) { var output =
document.getElementById('output'); output.innerHTML = message; }
Blockquote
var blank = "";
function print(message) {
var output = document.getElementById('output');
output.innerHTML = message;
}
function getQuote(array) {
var quotes = '<h2 class="quote">' + 'quote: ' + array.quote + '</h2>';
quotes += '<p class="source">' + 'Soure: ' + array.source + '</p>';
quotes += '<p class="year">' + 'year: ' + array.year + '</p>';
quotes += '<p class="citation">' + 'citation: ' + array.citation + '</p>';
return quotes
};
>
var quotes = [{
quote: "Great man", source: "jack mike", year: 1990, citation: "movie"},
{ quote: "Good stuff", source:"Mac jones", year: 1989, citation: "book"},
{ quote: "i love you", source: "mom and dad", year: 1993, citation: "love"},
{quote: "you're a hero", source: "hero man", year: 2020, citation: "future"},
{quote: "you're a wizard", source: "hero wizard", year: 2022, citation: "future4"},
{quote: "you're a man", source: "hero man33", year: 2025, citation: "future3"},
{quote: "you're a good person", source: "hero person", year: 2021, citation: "future2"},
{quote: "you're a web developer", source: "hero developer", year: 2026, citation: "futures"}
];
var i = Math.round(Math.random() * quotes.length - 1);
blank += getQuote(quotes[i]);
print(blank);
function timer(){
setInterval(print(blank), 3000);
}
timer();
So here I need to link that print function to the onclick so that when I click the button, it keeps printing out that message to the page in the same spot. It's a random quote generator code so what I want is it prints random quotes to the page when i click the button.
When I load the page everything loads as it should, but when I click the button NOTHING happens, just clicks and that's it.
IGNORE THE QUOTES TEXT its stupid dumb stuff long story, i would never use those quotes for a actual website
Sorry if I gave a bad description, as you can see I'm new to coding.
Thank you for the help!
The problem is when you're calling your function from the onclick attribute here:
<button onclick="print(blank)">Click me</button>
You would have seen an error in the JavaScript console saying this when you clicked the button:
ReferenceError: Can't find variable: blank
If you want to print blank, you'll need quotation marks around the string you want to print. You can either use single quotation marks like so:
<button onclick="print('blank')">Click me</button>
Or you can use escaped double quotes like this:
<button onclick="print(\"blank\")">Click me</button>
Is the print() function defined in the student_report.js file? If not, you have to also define the function in a <script> tag. And like said already, the "blank" variable has to be in a global scope.
The argument in the javascript file is called blank
Not sure what you mean there. If you're trying to pass a variable, it would have to be in global scope
Edit:
ok, it looks like the problem is that you're expecting print(blank) to change the quote displayed in the output div but print only changes the innerHTML of the div, it doesn't change blank, here's your code with a console.log in print to show that print is called.
var blank = "";
function print(message) {
console.log('here')
var output = document.getElementById('output');
output.innerHTML = message;
}
function getQoute(array) {
var qoutes = '<h2 class="qoute">' + 'qoute: ' + array.qoute + '</h2>';
qoutes += '<p class="source">' + 'Soure: ' + array.source + '</p>';
qoutes += '<p class="year">' + 'year: ' + array.year + '</p>';
qoutes += '<p class="citation">' + 'citation: ' + array.citation + '</p>';
return qoutes
};
var qoutes = [{
qoute: "Great man", source: "jack mike", year: 1990, citation: "movie"},
{ qoute: "Good stuff", source:"Mac jones", year: 1989, citation: "book"},
{ qoute: "i love you", source: "mom and dad", year: 1993, citation: "love"},
{qoute: "you're a hero", source: "hero man", year: 2020, citation: "future"},
{qoute: "you're a wizard", source: "hero wizard", year: 2022, citation: "future4"},
{qoute: "you're a man", source: "hero man33", year: 2025, citation: "future3"},
{qoute: "you're a good person", source: "hero person", year: 2021, citation: "future2"},
{qoute: "you're a web developer", source: "hero developer", year: 2026, citation: "futures"}
];
var i = Math.round(Math.random() * qoutes.length - 1);
blank += getQoute(qoutes[i]);
print(blank);
function timer(){
setInterval(print(blank), 3000);
}
timer();
<h1 class = "qoutes">Qoutes</h1>
<img src ="https://placeimg.com/1100/300/nature" alt="nature" class="nature">
<div id = "output">
</div>
<script type ="text/javascript" src="js/student_report.js"></script>
<button onclick="print(blank)">Click me</button>
Here's an update to your code that updates the quote and fixes a bunch of other stuff:
const quotes = [
{ quote: "Great man", source: "jack mike", year: 1990, citation: "movie" },
{ quote: "Good stuff", source:"Mac jones", year: 1989, citation: "book" },
{ quote: "i love you", source: "mom and dad", year: 1993, citation: "love" },
{ quote: "you're a hero", source: "hero man", year: 2020, citation: "future" },
{ quote: "you're a wizard", source: "hero wizard", year: 2022, citation: "future4" },
{ quote: "you're a man", source: "hero man33", year: 2025, citation: "future3" },
{ quote: "you're a good person", source: "hero person", year: 2021, citation: "future2" },
{ quote: "you're a web developer", source: "hero developer", year: 2026, citation: "futures" }
];
function changeQuote() {
const i = Math.floor(Math.random() * quotes.length);
document.getElementById('output').innerHTML = getQuote(quotes[i]);
}
function getQuote({quote, source, year, citation}) {
return `
<h2 class="quote">quote: ${quote}</h2>
<p class="source">soure: ${source}</p>
<p class="year">year: ${year}</p>
<p class="citation">citation: ${citation}</p>`;
};
changeQuote();
<h1 class = "quotes">Quotes</h1>
<img src ="https://placeimg.com/1100/300/nature" alt="nature" class="nature">
<div id = "output">
</div>
<script type ="text/javascript" src="js/student_report.js"></script>
<button onclick="changeQuote()">Click me</button>
replace below code instead of your existing button code
<button onclick="print('blank')">Click me</button>
when you send string to a function you have to use single/double quotes otherwise it will consider as js variable.
In Ruby-on-Rails, I am using the Chosen plugin on a multiselector for a list of provinces as below:
<%= select_tag :provinces,
options_for_select(DataHelper::all_provinces_captions.zip(DataHelper::all_provinces_ids)),
{:multiple => true, class: 'chosen-select chzn-select',
:data => {:placeholder => 'Filter Provinces/States'}}%>
I also have a selector in a form field on the same page like so:
<%= f.select :province_ids,
(DataHelper::all_provinces_captions.zip(DataHelper::all_provinces_ids)),
{ include_blank: true }, {
multiple: true, data: {placeholder: 'Filter Provinces/States'} }
%>
Finally, I have a Javascript function that synchronizes the two when #provinces, with class .chzn-select changes:
var selectedVals = [];
$(".chzn-select").chosen().change(function() {
$("#provinces option:selected").each(function () {
console.log ("this value is " + ($(this).val));
selectedVals.push($(this).val);
});
$("#education_plan_province_ids").empty();
for (var i = 0; i < selectedVals.length; i++) {
console.log (selectedVals[i] + " selected");
$("#education_plan_province_ids").append($("<option>" + selectedVals[i] + "</option>")).prop("selected", true);
}
});
However, in my console, instead of getting an output, "this value is alabama" for example, I get the following:
this value is function (a){var b,c,d,e=this[0];{if(arguments.length)return
d=n.isFunction(a),this.each(function(c){var e;1===this.nodeType&&(e=d
a.call(this,c,n(this).val()):a,null==e?e="":"number"==typeof e
e+="":n.isArray(e)&&(e=n.map(e,function(a){return
null==a?"":a+""})),b=n.valHooks[this.type]||n.valHooks[this.nodeName.toLowerCase(
],b&&"set"in b&&void 0!==b.set(this,e,"value")||(this.value=e))});if(e)return
b=n.valHooks[e.type]||n.valHooks[e.nodeName.toLowerCase()],b&&"get"in b&&void 0!=
(c=b.get(e,"value"))?c:(c=e.value,"string"==typeof c
c.replace(bc,""):null==c?"":c)}}
So not surprisingly, I am very confused as to why this is happening!
For a final piece of info, here is all_provinces_captions, all_provinces_ids, canada_provinces_with_caption, and usa_provinces_with_caption in the DataHelper, all arrays:
def self.usa_provinces_with_caption
[["Alabama", "alabama"], ["Alaska", "alaska"], ["Arizona", "arizona"], ["Arkansas", "arkansas"], ["California", "california"], ["Colorado", "colorado"], ["Connecticut", "connecticut"], ["Delaware", "delaware"], ["District Of Columbia", "district of columbia"], ["Florida", "florida"], ["Georgia", "georgia"], ["Hawaii", "hawaii"], ["Idaho", "idaho"], ["Illinois", "illinois"], ["Indiana", "indiana"], ["Iowa", "iowa"], ["Kansas", "kansas"], ["Kentucky", "kentucky"], ["Louisiana", "louisiana"], ["Maine", "maine"], ["Maryland", "maryland"], ["Massachusetts", "massachusetts"], ["Michigan", "michigan"], ["Minnesota", "minnesota"], ["Mississippi", "mississippi"], ["Missouri", "missouri"], ["Montana", "montana"], ["Nebraska", "nebraska"], ["Nevada", "nevada"], ["New Hampshire", "new hampshire"], ["New Jersey", "new jersey"], ["New Mexico", "new mexico"], ["New York", "new york"], ["North Carolina", "north carolina"], ["North Dakota", "north dakota"], ["Ohio", "ohio"], ["Oklahoma", "oklahoma"], ["Oregon", "oregon"], ["Pennsylvania", "pennsylvania"], ["Rhode Island", "rhode island"], ["South Carolina", "south carolina"], ["South Dakota", "south dakota"], ["Tennessee", "tennessee"], ["Texas", "texas"], ["Utah", "utah"], ["Vermont", "vermont"], ["Virginia", "virginia"], ["Washington", "washington"], ["West Virginia", "west virginia"], ["Wisconsin", "wisconsin"], ["Wyoming", "wyoming"]]
end
def self.canada_provinces_with_caption
[["Alberta", "alberta"], ["British Columbia", "british columbia"], ["Manitoba", "manitoba"], ["New Brunswick", "new brunswick"], ["Newfoundland", "newfoundland"], ["Northwest Territories", "northwest territories"], ["Nova Scotia", "nova scotia"], ["Nunavut", "nunavut"], ["Ontario", "ontario"], ["Prince Edward Island", "prince edward island"], ["Quebec", "quebec"], ["Saskatchewan", "saskatchewan"], ["Yukon", "yukon"]]
end
def self.all_provinces_captions
usa_provinces_with_caption.map { |x| x.first } + canada_provinces_with_caption.map { |x| x.first }
end
def self.all_provinces_ids
usa_provinces_with_caption.map { |x| (Province.find_by name: x.first).id} + canada_provinces_with_caption.map { |x| (Province.find_by name: x.first).id }
end
It looks like your missing the parenthesis for the .val method. Try the following:
$(this).val()
Try, on your rendered page, inspect the chosen element and check the element (it usually is hidden) and pick the id there to replace
$(".chzn-select").chosen().change(function() {
}
for
$("#your-id").change(function() {
// do some stuff
$("#your-id").trigger("liszt:updated"); //This is necessary when you change your chosen select options, so it refresh the component
}
Hope it helps!
I'm new with lodash but as the title states 'I'd like to push non-existing items inside an already declared object if they don't already exist' that is if I have
var lessdata = {
"id": 1004,
"name": "some event",
"bookmarked": false //not in moredata and I'd like to keep the var as is
};
var moredata = {
"id": 1004,
"name": "some event",
"time": { //from here
"hours": 2,
"minutes": 00,
"currency": "USD"
},
"place": "some place" //to here is new without '"bookmarked": false'
};
I'd like to have my result loaded back into the lessdata variable and have my result look like so
var lessdata = {
"id": 1004,
"name": "some event",
"time": {
"hours": 2,
"minutes": 00,
"currency": "USD"
},
"place": "some place",
"bookmarked": false
};
I stuck knowing know to use lodash apprpriatly in angular and wasnt sure if I need to use angualar's forEach or not.
I've dabbled with two approaches.
version 1
lessdata= _.uniq(lessdata, function(moredata) {
return moredata;
});
version 2
angular.forEach(lessdata, function(lkey, lvalue) {
console.log("[-]lessdata---lkey: " + lkey + ", lvalue: " + lvalue)
angular.forEach(moredata, function(mkey, mvalue) {
console.log("[+]moredata---mkey: " + mkey + ", mvalue: " + mvalue)
lessdata=_.uniq(lessdata, function(moredata) {
return moredata;
});
})
})
$scope.event = lessdata
Im assuming using _.uniq is the best approach? any help would be appreciated and I created a codepen here.
TLDR: just read the title
That's what lodash.defaults does:
Assigns own and inherited enumerable properties of source objects to the destination object for all destination properties that resolve to undefined.
lodash.defaults(lessdata, moredata);
I have json data in tree format:
[
{
"beer_names": [
"Apple Ale",
"Bad Seed Pumpkin Ale"
],
"brewery": "Basil T's Brew Pub and Italian Grill"
},
{
"beer_names": [
"5 C's IPA",
"Bottle Rocket IPA",
"Kate The Great Russian Imperial Stout",
"Wheat Wine"
],
"brewery": "Portsmouth Brewery"
},
{
"beer_names": [
"Black Forest Dunkelweizen",
"Equinox E.S.B.",
"Evolutionary IPA",
"G.E. Lite",
"Nut Brown",
"Red",
"Smoked Porter"
],
"brewery": "Glen Ellyn Sports Brew"
}
]
So I want to fill this data to Dropdown box like this:
--Basil T's Brew Pub and Italian Grill
--------Apple Ale
--------Bad Seed Pumpkin Ale
--Portsmouth Brewery
--------5 C's IPA
--------Bottle Rocket IPA
--------Wheat Wine
--------Kate The Great Russian Imperial Stout
--Glen Ellyn Sports Brew
--------Black Forest Dunkelweizen
--------Equinox E.S.B.
--------Evolutionary IPA
--------G.E. Lite
--------Nut Brown
--------Red
--------Smoked Porter
Or a tree view allow for select value name of child equipment?
Here you are:
var data = [{
"beer_names": [
"Apple Ale",
"Bad Seed Pumpkin Ale"
],
"brewery": "Basil T's Brew Pub and Italian Grill"
}, {
"beer_names": [
"5 C's IPA",
"Bottle Rocket IPA",
"Kate The Great Russian Imperial Stout",
"Wheat Wine"
],
"brewery": "Portsmouth Brewery"
}, {
"beer_names": [
"Black Forest Dunkelweizen",
"Equinox E.S.B.",
"Evolutionary IPA",
"G.E. Lite",
"Nut Brown",
"Red",
"Smoked Porter"
],
"brewery": "Glen Ellyn Sports Brew"
}];
$.each(data, function(index, value) {
var str = '<optgroup label="' + value["brewery"] + '">';
$.each(value['beer_names'], function(index, value) {
str += '<option value="' + value + '">' + value + '</option>';
});
str += '</select>';
$('select').append(str);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select></select>
Hope this helps.
You can see this link :
http://www.jeasyui.com/demo/main/index.php?plugin=ComboBox
then you select Group ComboBox from left panel.
Maybe help you