We Keep Coding

How to order by string by Month name using javascript?

I have a string "APRIL,AUGUST,JULY,JUNE,MAY". I want to order it by month name.
The required output is APRIL,MAY,JUNE,JULY,AUGUST.

You can keep order list of all months and do the sorting based on that:
const order = ["JANUARY", "FEBRUARY", "MARCH", "APRIL", "MAY", "JUNE", "JULY", "AUGUST", "SEPTEMBER", "OCTOBER", "NOVEMBER", "DECEMBER"];
const sort = (data) =>
data
.split(',')
.sort((a, b) => order.indexOf(a) - order.indexOf(b))
.join()
const data1 = 'APRIL,AUGUST,JULY,JUNE,MAY'
console.log(sort(data1))
const data2 = 'APRIL,AUGUST,JULY,JUNE,MAY,APRIL'
console.log(sort(data2))

The easiest solution is probably:
const s = "APRIL,AUGUST,JULY,JUNE,MAY";
const months = ["JANUARY", "FEBRUARY", "MARCH", "APRIL", "MAY", "JUNE", "JULY", "OCTOBER", "SEPTEMBER", "NOVEMBER", "DECEMBER"]
let resultArray = [];
months.forEach(month => {
if (s.includes(month)) {
resultArray.push(month);
}
})
console.log(resultArray.join(','));

Use Array#filter() on preordered array and check if each name exists in the string
const s = "APRIL,AUGUST,JULY,JUNE,MAY";
const months = ["JANUARY", "FEBRUARY", "MARCH", "APRIL", "MAY", "JUNE", "JULY", "OCTOBER", "SEPTEMBER", "NOVEMBER", "DECEMBER"]
const res = months.filter(m => s.includes(m)).join()
console.log(res)

The other solutions might be inefficient because they rely on the String.includes or Array.indexOf prototypes, which cost alone O(n) (where n is the length of the input string).
I propose an alternative solution that uses a dictionary, which supports indexing in amortized O(1) time.
The overall time complexity is O(m logm), where m is the number of months in the input string.
You can index month names in monthNamesObj in amortized O(1) time.
const input = "APRIL,AUGUST,JULY,JUNE,MAY";
// inputMonthNames = ['APRIL', 'AUGUST', 'JULY', 'JUNE', 'MAY']
const inputMonthNames = input.split(',');
// dictionary that maps month names to the correspective order index
const monthNamesObj = {
'JANUARY': 0,
'FEBRUARY': 1,
'MARCH': 2,
'APRIL': 3,
'MAY': 4,
'JUNE': 5,
'JULY': 6,
'AUGUST': 7,
'SEPTEMBER': 8,
'OCTOBER': 9,
'NOVEMBER': 10,
'DECEMBER': 11,
};
// sort the input month names according to their numeric order
const orderedMonths = inputMonthNames.sort((a, b) => monthNamesObj[a] - monthNamesObj[b]);
// APRIL,MAY,JUNE,JULY,AUGUST
console.log(orderedMonths.join(','));

JavaScript Object retrieve value dynamically

Sorry if it sounds like a stupid question
I have this following JavaScript object:
data = {
"Max" : 100
}
This same object can also have the following form:
data = {
"January": {"Max" : 100}
}
I want to use one same function to retrieve the value of Max if given the two forms
And it made me wonder if it is possible to write a conditional expressions directly in the [] when you write the values you want to retrieve? Is this following expression allowed in JavaScript? Something like this:
data[monthly ? 'month' : '']
Of course I tried it and it doesn't work. But is there another way to do such a thing in a line? monthly is a boolean

You can use the following script to do that, I have added some comments to make it clear
var data1 = {
"Max" : 100
}
var data2 = {
"January": {"Max" : 100}
}
// storing the months in an array to loop over and see if the current key is a month
var months = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
function getMax(data) {
// if the key `Max` exists in data then just get the value of `data.Max` else loop over the months, and see if one of the months is a key and stores a truthy value, in this case it stores an object, so that's what we want and then get it's .Max value
return "Max" in data ? data.Max : data[months.filter(m => data[m] ? m : "")[0]].Max;
}
console.log(getMax(data1));
console.log(getMax(data2));

You can make use of Object.values
let data = {
"Max": 100
};
const getMax = (data) => {
//check if "Max" is available in the `data`, if so return `data.Max` else
//get values of the keys in the object using `Object.values` and
//retreive `Max` from the array
return data.Max ? data.Max : Object.values(data)[0].Max
}
console.log(getMax(data));
data = {
"January": {
"Max": 200
}
}
console.log(getMax(data));
There's yet another way of achieving this using Array.find and Optional Chaining.
let data = {
Max: 100,
};
const getMax = (data = {}) => {
return data.Max ? data.Max : Object.values(data).find(({ Max }) => Max)?.Max;
};
console.log(getMax(data));
data = {
January: { Max: 200 },
};
console.log(getMax(data));

vue.js referencing constants in data?

Just wondering, I have the following setup:
new Vue({
el: '#app',
const: {
monthNames : ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"],
},
data: {
year : (new Date()).getFullYear(),
month : (new Date()).getMonth(),
monthName : this.monthNames[(new Date()).getMonth()],
day : (new Date()).getDate(),
},
...
)}
As you can see, I'm trying to pass in (new Date()).getMonth() into the monthNames array from const - but console is returning the Uncaught TypeError: Cannot read property '4' of undefined.
So my question is simply: how do I reference monthNames from within data?
N.B. I'm using the most recent js dev build.

You could declare it outside the Vue instance or perhaps in another module and import it before using like import { monthNames } from './constants', and then use it whenever you want.
If you want to keep it inside that particular Vue instance then i think it would be better to put it inside the computed structure for caching.
Example:
const monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"]
new Vue({
el: '#app',
data: {
year : (new Date()).getFullYear(),
month : (new Date()).getMonth(),
monthName : monthNames[(new Date()).getMonth()],
day : (new Date()).getDate(),
},
...
)
A question that matches yours: https://stackoverflow.com/a/46883212/7395911
A discussion about a constant structure within Vue: https://github.com/vuejs/vue/issues/6004

I'm a newbie to Vue but you can attach it to the Vue simply by calling:
Vue.prototype.$monthNames
And then calling it within data using monthNames
From what I can find you can also use mixins (seems a bit dangerous, affects all components) or simply just declaring a constant before loading the Vue instance.

moment.js year/number format with arabic locale

I am formatting dates using moment.js with arabic locale (ar_SA) set.
moment.locale('ar_SA');
moment([2016,05,01]).format('MMM YYYY');
//output مايو ٢٠١٦
I would like to format only the month part using the locale, but the year in english, example: "مايو 2016" (the same as when formatting using the angular filter: | date:'MMM yyyy')
Is there a way to configure moment.js to do this automatically? (instead of splitting the month and year formatting and simply concatenating 2016 to .format('MMM'))

moment.updateLocale('en', {
months : [
"January", "February", "March", "April", "May", "June", "July",
"August", "September", "October", "November", "December"
]
});
Source: https://momentjs.com/docs/#/customization/month-names/

I never did find a solution to this. I opted for a split/manual approach instead:
currentDate.format('MMM') + ' ' + currentDate.clone().locale('en').format('YYYY');

CultureInfo in JavaScript

In c# I use the below method in order to get the CultureInfo.
System.Globalization.CultureInfo.CurrentCulture.Name // output :en-US
Can any one tell me how can I get the CultureInfo in JavaScript?

Very easy way is to render it into the view, like this:
<script>
var cultureInfo = '#System.Globalization.CultureInfo.CurrentCulture.Name';
</script>
This is razor syntax, if you use classic asp.net, then use:
<script>
var cultureInfo = '<%= System.Globalization.CultureInfo.CurrentCulture.Name %>';
</script>

This is a very old post an is definately in need of an update. All major browsers now support the navigator property. Simply use
var lang = navigator.language

It depends on your goal. If you want the entire website to be treated as the same culture as your server, you can use System.Globalization.CultureInfo.CurrentCulture.Name only and remove the if-then shorthand within the first code snippet. This is not advisable if you have a global website.
Include the following in the bottom of your page:
<input id="currentCulture" type="hidden" value="<%=((Request.UserLanguages != null && Request.UserLanguages.Length > 0) ? new System.Globalization.CultureInfo(Request.UserLanguages.First(), true).Name : System.Globalization.CultureInfo.CurrentCulture.Name) %>" />
Now you can retrieve the culture info specific to the user, within your javascript, using:
$("#currentCulture").val(); //Jquery
document.getElementById("currentCulture").value; //Pure javascript
Within your code behind, any datetime parsing you require, pass in the culture info provider to the parse and tryparse and Convert.ToDateTime functions by using the below:
CultureInfo info = ((Request.UserLanguages != null && Request.UserLanguages.Length > 0) ? new CultureInfo(Request.UserLanguages.First(), true) : System.Globalization.CultureInfo.CurrentCulture);
Note: if you use Jquery UI and have cultures not included by default (such as en-CA or en-GB), you will have to add them. You can retrieve the code here:
https://code.google.com/p/dobo/source/browse/trunk/dobo/Kooboo.CMS/Kooboo.CMS.Web/Scripts/jquery-ui-i18n/?r=7
You can then include it dynamically by following the below example:
$.datepicker.regional['en-CA'] = { "Name": "en-CA", "closeText": "Close", "prevText": "Prev", "nextText": "Next", "currentText": "Today", "monthNames": ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December", ""], "monthNamesShort": ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec", ""], "dayNames": ["Sunday", "Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"], "dayNamesShort": ["Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"], "dayNamesMin": ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"], "dateFormat": "dd/mm/yy", "firstDay": 0, "isRTL": false };
$(".datepick").datepicker($.datepicker.setDefaults($.datepicker.regional[$("#currentCulture").val()]));