Replicating Codeigniter's humanize() and underscore() function in Javascript - javascript

I'm trying to replicate CI's humanize() and underscore() function in Javascript.
From the CI documentation, underscore() takes multiple words separated by spaces and underscores them while humanize() takes multiple words separated by underscores and adds spaces between them. The CI implementation looks something like:
function underscore($str) {
return preg_replace('/[\s]+/', '_', strtolower(trim($str)));
}
function humanize($str) {
return ucwords(preg_replace('/[_]+/', ' ', strtolower(trim($str))));
}
My code doesn't have to replicate the behavior exactly, but for the underscore() function I'd like it to be able to deal with multiple whitespace characters, while the humanize() function can be a bit looser and assume that only one underscore will only be there to separate each word.
So far what I have is:
function underscore(string) {
string = $.trim(string).toLowerCase();
var oldString;
while(oldString !== string){
oldString = string;
string = string.replace(/\s+/, '_');
}
return string;
}
function humanize(string) {
string = $.trim(string);
var terms = string.split('_');
for(var i=0; i < terms.length; i++){
terms[i] = terms[i].charAt(0).toUpperCase() + terms[i].slice(1);
}
return terms.join(' ');
}
Which works fine, yes, but I don't really like the way I did this (It's way too long compared to the PHP. There must be a more compact version), so I'm wondering if there's a more efficient / readable method to achieve this.

You can use the g modifier to do the replacement globally as:
function underscore(string) {
string = $.trim(string).toLowerCase();
return string.replace(/\s+/g, '_');
}

Related

Replace leading numbers with Javascript regex

As a follow up to this question (not by me), I need to replace leading numbers of an id with \\3n (where n is the number we're replacing).
Some examples:
"1foo" -> "\\31foo"
"1foo1" -> "\\31foo1"
"12foo" -> "\\31\\32foo"
"12fo3o4" -> "\\31\\32fo3o4"
"foo123" -> "foo123"
Below is a solution that replaces every instance of the number, but I don't know enough regex to make it stop once it hits a non-number.
function magic (str) {
return str.replace(/([0-9])/g, "\\3$1");
}
... Or is regex a bad way to go? I guess it would be easy enough to do it, just looping over each character of the string manually.
Here is a way to achieve what you need using a reverse string + look-ahead approach:
function revStr(str) {
return str.split('').reverse().join('');
}
var s = "12fo3o4";
document.write(revStr(revStr(s).replace(/\d(?=\d*$)/g, function (m) {
return m + "3\\\\";
}))
);
The regex is matching a number that can be followed by 0 or more numbers only until the end (which is actually start) of a reversed string (with \d(?=\d*$)). The callback allows to manipulate the match (we just add reversed \\ and 3. Then, we just reverse the result.
Just use two steps: first find the prefix, then operate on its characters:
s.replace(/^\d+/, function (m) {
return [].map.call(m, function (c) {
return '\\3' + c;
}).join('');
});
No need to emulate any features.
Here is how I would have done it:
function replace(str) {
var re = /^([\d]*)/;
var match = str.match(re)[0];
var replaced = match.replace(/([\d])/g, "\\3$1");
str = str.replace(match, replaced);
return str;
}
document.write(replace("12fo3o4"));
Don't get me wrong: the other answers are fine! My focus was more on readability.

Generate "serial" code with specific pattern

So what I'm trying to accomplish is that for example if I have 0000-0000-0000-0000, then I'd like to have for example 2nd code letters only and/or specific letters that I could set myself as a preset such as: 2KS8-LMAO-8XG2-48SY. Right now I have the code to replace each string with random letter/number that I've written in html.
function randomised(len) {
return Math.floor(Math.random() * len);
}
function randomiseString(str){
var charSet = "abcdefghijklmnopqrstuvwxyz0123456789";
var str = str.replace(/[^-]/g,function() {
var a = charSet[randomised(charSet.length)].toUpperCase();
return a;
});
return str;
}
$('.combination').text(function(i,t){
return randomiseString(t);
});
--
<b>Random Combination:</b> <span class="combination">0000-0000-0000-0000</span>
Thanks in advance.
You would need to somehow pass in a pattern that you wanted it to match. Then separate your str_replace into multiple parts. So, if you wanted to replace a character you would use one set of characters, with a letter you would use a different set of characters. Something like this perhaps:
var chars = "abcdefghijklmnopqrstuvwxyz"
var nums = "0123456789"
str.replace(/[0-9]/g, function () {
return nums[randomised(nums.length()];
}
str.replace(/[a-z]/g, function () {
return chars[randomised(chars.length()].toUpperCase();
}
In this case, whatever str holds will be the pattern, you could then define patterns. Such as 0000-aaaa-0000-aaaa each time you run the script, the pattern will remain the same (i.e. 4 numbers, 4 letters, etc)

Javascript IndexOf with integers in string not working

Can anyone tell me why does this not work for integers but works for characters? I really hate reg expressions since they are cryptic but will if I have too. Also I want to include the "-()" as well in the valid characters.
String.prototype.Contains = function (str) {
return this.indexOf(str) != -1;
};
var validChars = '0123456789';
var str = $("#textbox1").val().toString();
if (str.Contains(validChars)) {
alert("found");
} else {
alert("not found");
}
Review
String.prototype.Contains = function (str) {
return this.indexOf(str) != -1;
};
This String "method" returns true if str is contained within itself, e.g. 'hello world'.indexOf('world') != -1would returntrue`.
var validChars = '0123456789';
var str = $("#textbox1").val().toString();
The value of $('#textbox1').val() is already a string, so the .toString() isn't necessary here.
if (str.Contains(validChars)) {
alert("found");
} else {
alert("not found");
}
This is where it goes wrong; effectively, this executes '1234'.indexOf('0123456789') != -1; it will almost always return false unless you have a huge number like 10123456789.
What you could have done is test each character in str whether they're contained inside '0123456789', e.g. '0123456789'.indexOf(c) != -1 where c is a character in str. It can be done a lot easier though.
Solution
I know you don't like regular expressions, but they're pretty useful in these cases:
if ($("#textbox1").val().match(/^[0-9()]+$/)) {
alert("valid");
} else {
alert("not valid");
}
Explanation
[0-9()] is a character class, comprising the range 0-9 which is short for 0123456789 and the parentheses ().
[0-9()]+ matches at least one character that matches the above character class.
^[0-9()]+$ matches strings for which ALL characters match the character class; ^ and $ match the beginning and end of the string, respectively.
In the end, the whole expression is padded on both sides with /, which is the regular expression delimiter. It's short for new RegExp('^[0-9()]+$').
Assuming you are looking for a function to validate your input, considering a validChars parameter:
String.prototype.validate = function (validChars) {
var mychar;
for(var i=0; i < this.length; i++) {
if(validChars.indexOf(this[i]) == -1) { // Loop through all characters of your string.
return false; // Return false if the current character is not found in 'validChars' string.
}
}
return true;
};
var validChars = '0123456789';
var str = $("#textbox1").val().toString();
if (str.validate(validChars)) {
alert("Only valid characters were found! String validates!");
} else {
alert("Invalid Char found! String doesn't validate.");
}
However, This is quite a load of code for a string validation. I'd recommend looking into regexes, instead. (Jack's got a nice answer up here)
You are passing the entire list of validChars to indexOf(). You need to loop through the characters and check them one-by-one.
Demo
String.prototype.Contains = function (str) {
var mychar;
for(var i=0; i<str.length; i++)
{
mychar = this.substr(i, 1);
if(str.indexOf(mychar) == -1)
{
return false;
}
}
return this.length > 0;
};
To use this on integers, you can convert the integer to a string with String(), like this:
var myint = 33; // define integer
var strTest = String(myint); // convert to string
console.log(strTest.Contains("0123456789")); // validate against chars
I'm only guessing, but it looks like you are trying to check a phone number. One of the simple ways to change your function is to check string value with RegExp.
String.prototype.Contains = function(str) {
var reg = new RegExp("^[" + str +"]+$");
return reg.test(this);
};
But it does not check the sequence of symbols in string.
Checking phone number is more complicated, so RegExp is a good way to do this (even if you do not like it). It can look like:
String.prototype.ContainsPhone = function() {
var reg = new RegExp("^\\([0-9]{3}\\)[0-9]{3}-[0-9]{2}-[0-9]{2}$");
return reg.test(this);
};
This variant will check phones like "(123)456-78-90". It not only checks for a list of characters, but also checks their sequence in string.
Thank you all for your answers! Looks like I'll use regular expressions. I've tried all those solutions but really wanted to be able to pass in a string of validChars but instead I'll pass in a regex..
This works for words, letters, but not integers. I wanted to know why it doesn't work for integers. I wanted to be able to mimic the FilteredTextBoxExtender from the ajax control toolkit in MVC by using a custom Attribute on a textBox

Convert slug variable to title text with javascript

I'm trying to do something that would be similar to turning a url slug-like variable into text that could be used for a title.
So, I have a variable for example that is like this:
var thisID = 'athlete-profile';
function myFunc(thisID) {
// i need to use thisID as the id and href in a loop that generates a string of <li><a>'s\
function makeTitle(thisID) {
// convert thisID to text so for this example it would return 'Athlete Profile'
return 'Athlete Profile';
}
for () {
var str = '<li id="'+thisID+'">'+makeTitle(thisID)+'';
}
// make sense?
}
I'd like to not use a regex to do this if possible somehow, but I don't think there's a way to do it without one. So any one who knows how to do this type of thing let me know, it would be a great help.
Thanks
I would advise you to use regular expression. But if you really don't want to use regular expressions, the solution below would work for simple cases. Feel free to modify it as you like it.
function makeTitle(slug) {
var words = slug.split('-');
for (var i = 0; i < words.length; i++) {
var word = words[i];
words[i] = word.charAt(0).toUpperCase() + word.slice(1);
}
return words.join(' ');
}
console.log(
makeTitle("athlete-profile")
)
function titleize(slug) {
var words = slug.split("-");
return words.map(function(word) {
return word.charAt(0).toUpperCase() + word.substring(1).toLowerCase();
}).join(' ');
}
console.log(titleize("athlete-profile"))
It works pretty simply:
It splits the string by - into words.
It maps each word into title case.
It joins the resulting words with spaces.
Do it in one line:
'athlete-profile'.split("-").join(" ").replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase()})
Output: Athlete Profile
The makeTitle() part of your question can be implemented something like this:
function makeTitle(thisID) {
return thisID.replace(/-/g, " ").replace(/\b[a-z]/g, function() {
return arguments[0].toUpperCase();
});
}
console.log(makeTitle("athlete-profile"))
The first .replace() changes all hyphens to spaces, and then the second .replace() takes any lower-case letter that follows a word boundary and makes it upper-case.
(For more information see the MDN doco for .replace().)
As far as doing it without using regular expressions, I'm not sure why you'd specifically want to avoid them, especially when the required expressions are pretty simple in this case (especially if you do the hyphen to space and first letter capitalisation in two steps as shown above). But there are endless ways to do this without regex using various combinations of JavaScript's string manipulation methods.
Do it like this
let someString = 'im a string';
console.log(someString.replace(/-/g, ' ')
.replace(/\w\S*/g, function (txt) {
return
txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase()
})
)
Output: Im A String
Short and great way:
const slugToText = (slug) => {
return slug.toLowerCase().replace(/-/g,' ')
}
Much Simplified answer
we can use String.prototype.replaceAll method to easily achieve this
function convertSlugToString(slug) {
return slug.replaceAll("-", " ");
}
incase you want to make sure the output is all lowercase then you can do the following
function convertSlugToString(slug) {
return slug.toLowerCase().replaceAll("-", " ");
}
Additional info:
String.prototype.replaceAll() is a ES2021 feature and it also has a great browser support with 93.64% global coverage, click here for more info
if you want to support IE then refer to the other answers

Removing duplicates in a comma-separated list with a regex?

I'm trying to figure out how to filter out duplicates in a string with a regular expression, where the string is comma separated. I'd like to do this in javascript, but I'm getting caught up with how to use the back-references.
For example:
1,1,1,2,2,3,3,3,3,4,4,4,5
Becomes:
1,2,3,4,5
Or:
a,b,b,said,said, t, u, ugly, ugly
Becomes
a,b,said,t,u,ugly
Why use regex when you can do it in javascript code? Here is sample code (messy though):
var input = 'a,b,b,said,said, t, u, ugly, ugly';
var splitted = input.split(',');
var collector = {};
for (i = 0; i < splitted.length; i++) {
key = splitted[i].replace(/^\s*/, "").replace(/\s*$/, "");
collector[key] = true;
}
var out = [];
for (var key in collector) {
out.push(key);
}
var output = out.join(','); // output will be 'a,b,said,t,u,ugly'
p/s: that one regex in the for-loop is to trim the tokens, not to make them unique
If you insist on RegExp, here's an example in Javascript:
"1,1,1,2,2,3,3,3,3,4,4,4,5".replace (
/(^|,)([^,]+)(?:,\2)+(,|$)/ig,
function ($0, $1, $2, $3)
{
return $1 + $2 + $3;
}
);
To handle trimming of whitespace, modify slightly:
"1,1,1,2,2,3,3,3,3,4,4,4,5".replace (
/(^|,)\s*([^,]+)\s*(?:,\s*\2)+\s*(,|$)\s*/ig,
function ($0, $1, $2, $3)
{
return $1 + $2 + $3;
}
);
That said, it seems better to tokenise via split and handle duplicates.
Here's a example:
s/,([^,]+),\1/,$1/g;
Perl regex substitution, but should be convertible to JS-style by anyone who knows the syntax.
I don't use Regular Expressions for that.
Here's the function I use. It accepts a string containing comma separated values and returns an array of unique values regardless of position in the original string.
Note: If you pass CSV string containing quoted values, Split will not treat commas inside quoted values any differently. So if you want to handle real CSV, you are best to use a 3rd party CSV parser.
function GetUniqueItems(s)
{
var items=s.split(",");
var uniqueItems={};
for (var i=0;i<items.length;i++)
{
var key=items[i];
var val=items[i];
uniqueItems[key]=val;
}
var result=[];
for(key in uniqueItems)
{
// Assign to output result field using hasOwnProperty so we only get
// relevant items
if(uniqueItems.hasOwnProperty(key))
{
result[result.length]=uniqueItems[key];
}
}
return result;
}
With javascript regex
x="1,1,1,2,2,3,3,3,3,4,4,4,5"
while(/(\d),\1/.test(x))
x=x.replace(/(\d),\1/g,"$1")
1,2,3,4,5
x="a,b,b,said,said, t, u, ugly, ugly"
while(/\s*([^,]+),\s*\1(?=,|$)/.test(x))
x=x.replace(/\s*([^,]+),\s*\1(?=,|$)/g,"$1")
a,b,said, t, u,ugly
Not well tested, let me know if there is any issue.

Categories