How to avoid "null" with match() - javascript

I am using a method to find Media Queries in code.
function checkMediaQueries() {
var css = cssText;
var patt1 = /#media/gi;
countMQ = css.match(patt1).length;
if (countMQ == 0) {
return false;
} else {
return true;
}
}
It all works fine when it finds some Media Queries. But when the method cant find any, it wont return anything because countMQ is null. I know the problem, but cant find a solution for it.
How can i avoid this result and make my method return false instead?
Thx for help

Remove the .length, as null has no length
var countMQ = css.match(patt1);
and check for truthy, not 0
if (countMQ) {
return true;
} else {
return false;
}
or even null, if you wan't to be more specific
if (countMQ === null) {
or simpler
function checkMediaQueries() {
return cssText.match(/#media/gi) ? true : false;
}
FIDDLE

Related

How to return multiple functions dynamically Javascript

I apologize if I didn't ask my question in the correct way. Let me explain my problem.
I'm working on a search function in a table, I'm adding the option to search in specific columns.
Right now I'm manually checking if the checkboxes are selected or not, then return the proper search function.
However I want to make it dynamically, I don't want to edit this code after every time I add new columns to the table. That's where I'm struggling.
This is my current code:
vm.$watch('searchTerm', function (searchTerm) {
if (!searchTerm) {
vm.filteredTable = angular.copy(vm.table);
} else {
searchTerm = searchTerm.toLowerCase();
return vm.filteredTable.rows = vm.table.rows.filter(function (row) {
if (vm.searchFilter[0] === true ){
return (contains(row[vm.table.columns[0].value], searchTerm))
}
if (vm.searchFilter[1] === true ){
return (contains(row[vm.table.columns[1].value], searchTerm))
}
if (vm.searchFilter[2] === true ){
return (contains(row[vm.table.columns[2].value], searchTerm))
}
if (vm.searchFilter[3] === true ){
return (contains(row[vm.table.columns[3].value], searchTerm))
}
if (vm.searchFilter[4] === true ){
return (contains(row[vm.table.columns[4].value], searchTerm))
}
if (vm.searchFilter[5] === true ){
return (contains(row[vm.table.columns[5].value], searchTerm))
}
if (vm.searchFilter[6] === true ){
return (contains(row[vm.table.columns[6].value], searchTerm))
}
if (vm.searchFilter[7] === true ){
return (contains(row[vm.table.columns[7].value], searchTerm))
}
});
}
});
This is the way I created it, I tried to use a loop, but I can't return the functions if there is a loop. Also adding return before the for loop wont help either.
vm.$watch('searchTerm', function (searchTerm) {
if (!searchTerm) {
vm.filteredTable = angular.copy(vm.table);
} else {
searchTerm = searchTerm.toLowerCase();
return vm.filteredTable.rows = vm.table.rows.filter(function (row) {
for (let i=0; i<vm.searchFilter.length; i++){
if (vm.searchFilter[i] === true ){
return (contains(row[vm.table.columns[i].value], searchTerm))
}
}
});
}
});
This is probably a very easy case for the most of you, so I apologize if I'm just being stupid right now. I'm working since 2 hours on this till now...
EDIT:
The function I mean:
const contains = (value, searchTerm) => {
if (!value) return false;
return value.toLowerCase().includes(searchTerm);
}
2nd EDIT:
I just realized after a kind member told me that, that the first version isnt working either the way I want it.
There is the option to have a multiple selection, so if I select the first two checkboxes, then it should search in BOTH of them and not only one.
You can just iterate over the whole thing like this:
vm.$watch('searchTerm', function (searchTerm) {
if (!searchTerm) {
vm.filteredTable = angular.copy(vm.table);
} else {
searchTerm = searchTerm.toLowerCase();
return vm.filteredTable.rows = vm.table.rows.filter(row =>
vm.searchFilter.some((filter, index) => filter && contains(row[vm.table.columns[index].value])))
}
By using Array.prototype.some you essentially ask whether your row matches at least one of the filters.

Trying to solve If/else problem with specific string and boolean

Problem
I've tried multiple avenues and watched videos. I'm stuck...
function exerciseThree(typeOfPizza){
let lovesPizza;
// In this exercise, you will be given a variable, it will be called: typeOfPizza
// You are also given another variable called: lovesPizza;
// Using an if/else statement assign lovesPizza to true if typeOfPizza is 'pepperoni', assign it to false if it is 'olives'
What I've tried:
if (lovesPizza==='pepperoni') {
// The value is empty.
return true;
}
else {
(lovesPizza==='olives')
return false;
}
Another attempt
// if(lovesPizza===pepperoni){
// return true
//}
//else (lovesPizza===olives){
// return false
// }
Another one
//if (lovesPizza.equals(pepperoni))
// return "true";
//else (lovesPizza.equals(olives))
// return "false"
As the comments say, you're looking for if / else. You should also double check your reading of the question, you had your checking / assigning variables the wrong way around
function exerciseThree(typeOfPizza){
let lovesPizza;
if (typeOfPizza === 'pepperoni') {
lovesPizza = true;
} else if (typeOfPizza === 'olives') {
lovesPizza = false;
}
console.log('lovesPizza:', lovesPizza);
};
exerciseThree('pepperoni');
exerciseThree('olives');
I would highly recommend using a switch statement in this case here. Switch statements run faster and are easier to work with in my opinion.
But to point out what you're doing wrong:
Here you are checking if lovesPizza has the value of pepperoni. But you should be checking typeOfPizza. This is why you're most likely getting undefined:
if (lovesPizza==='pepperoni') {
// The value is empty.
return true;
}
else {
(lovesPizza==='olives')
return false;
}
Check out how this looks with a switch statement.
function exerciseThree(typeOfPizza) {
switch (typeOfPizza) {
case 'pepperoni':
return true;
case 'olives':
return false;
default:
return false;
}
}
exerciseThree('pepperoni');
exerciseThree('olives');
Your else statement needs an if
if(somethingisTrue)
{
return "it is true";
}
else if(somethingelseistrue)
{
return "no the other thing was true";
}
else
{
return "nothing is true"
}
Also === checks the strings equal and are both strings. It is often better to make sure the if is case insensative
if(!typeOfPizza)
{
//raise an error as null was passed in
return "false"
}
else if(typeOfPizza.toLowerCase().trim()==="pepperoni"){
{
return true..... you can build the rest
I often write a function (prototype) called cleanString or compareString to perform all the normal cleaning up of strings.
A simple solution is but doesn't use ifs as asked.
function exerciseThree(typeOfPizza){
let lovesPizza= typeOfPizza==="pepperoni";
return lovesPizza;
}
I certainly hope you teacher is playing a trick on you.
There is no sane suggestions what to do if you send for instance 'ham' into it, and not handle all possibilities are just sloppy.
let lovesPizza;
function exerciseThree(typeOfPizza){
if(typeOfPizza === 'pepperoni') {
return true;
} else if (typeOfPizza === 'olives') {
return false;
} else {
return undefined;
}
}
lovesPizza = exerciseThree('pepperoni');
console.log(lovesPizza); // true
lovesPizza = exerciseThree('olives');
console.log(lovesPizza); // false
lovesPizza = exerciseThree('ham');
console.log(lovesPizza); // undefined

Javascript variable comparison

I have javascript with global variable declared:
var IsUserAllowed = false;
And I have a function:
function setSelectedIdsInput(inputLogicalId) {
if (IsUserAllowed) {
This does not work, I assume the value of IsUserAllowed is in string.
So i did:
var isUserAllowedStr = IsUserAllowed.toString().toLowerCase();
if (isUserAllowedStr == "true") {
This works, Since im new to java script i wanted to know if its ok to compare strings like this.
This due to fact that doing:
if (isUserAllowedStr.localeCompare("true")) {
Did not work either !
Thanks!
Update - i suspect the global var was string and not Boolean. this why the if failed. when i did alert(IsUserAllowed) the output was "False"
var IsUserAllowed = false;
then
function setSelectedIdsInput(inputLogicalId) {
if (IsUserAllowed) {
// something true
} else {
// something false
}
or
if(IsUserAllowed === true)
but it is useless.
Try:
if (isUserAllowed === true) {
}
isUserAllowed is a boolean (true / false):
You can check it by simply doing
if (isUserAllowed) { }
Or
if (isUserAllowed === true) { }
Your example should work as expected.
You can play around in this JSFiddle to test for yourself: http://jsfiddle.net/bT8hV/
var IsUserAllowed = false;
function setSelectedIdsInput() {
if (IsUserAllowed) {
alert('TRUE');
}
else {
alert('FALSE');
}
};
setSelectedIdsInput();

Why childNodes[i] in function return undefined but alert an object?

Well, i'm writting my own getElementByClassName and this is my problem :
function getElementByClassName(elemento,clase){
var i = 0;
if(elemento.hasChildNodes()){
while(elemento.childNodes[i]){
if(elemento.childNodes[i].nodeType != 3){
if(elemento.childNodes[i].className == clase){
return elemento.childNodes[i]; // <---- This is my problem, change to alert
}
else {
getElementByClassName(elemento.childNodes[i],clase);
}
}
i++
}
}
}
var div = getElementByClassName(document.body,"foo");
alert(div);
It alerts undefined, but if i put ( in function) alert this alerts [objectHTMLDivElement] and undefined, so why this returns undefined if this recognize that's a [objectHTMLDivElement] with alert?
To answer your question, the reason why your implementation is not working is because you're recursively calling your function in the else clause and doing nothing with the return value. That's why your code is finding the object, but it's never getting returned.
This is a slightly reworked version of yours, but there are also other limitations to your approach, one being elements with multiple classes will not be found (i.e. <div class="foo bar"> will not be returned). Unless you're just doing this as a learning exercise, I suggest going with an existing implementation, like the link in Yoni's answer.
function getElementByClassName(elemento, clase)
{
var i = 0;
if (elemento.hasChildNodes())
{
while (elemento.childNodes[i])
{
if (elemento.childNodes[i].nodeType != 3)
{
if (elemento.childNodes[i].className == clase)
return elemento.childNodes[i];
else
{
var result = getElementByClassName(elemento.childNodes[i], clase);
if (result != null)
return result;
}
}
i++;
}
}
return null;
}

Return from inner function in JavaScript?

I have a jQuery-powered JavaScript function which iterates over a list of fields and checks to see whether they are empty; if so, blocks the submission of the form.
required_fields.forEach(function(field) {
if (field.val() == '')
{
field.addClass('field-highlight');
return false;
}
else
{
field.removeClass('field-highlight');
}
});
// I want to return to here from the return false point
How can I structure this differently to do what I want?
Just use a variable to keep track of the validation:
var is_valid = true;
required_fields.forEach(function(field) {
if (field.val() == '') {
field.addClass('field-highlight');
is_valid = false;
return false;
} else {
field.removeClass('field-highlight');
}
});
return is_valid;
Or, you can just use the field-highlight class as well:
required_fields.forEach(function(field) {
if (field.val() == '') {
field.addClass('field-highlight');
return false;
} else {
field.removeClass('field-highlight');
}
});
return $('.field-highlight').length == 0;
use a boolean in the forEach closure, which would be set to true, if the field value is empty. Check that value before submission of form
It sounds like you want to do the following
Update the elements with the field-highlight class based on whether or not they have a value
Block the form submission if any are empty
If so then try the following
var anyEmpty = false;
required_fields.forEach(function() {
if ($(this).value() == '') {
$(this).addClass('field-highlight');
anyEmpty = true;
} else {
$(this).removeClass('field-highlight');
}
});
if (anyEmpty) {
// Block the form
}
Did you write the "forEach" function? If so, that could check the return value of the anon function, and if it is ever false, stop iterating.
If your required_fields is a jQuery object, you could just do this:
var stop = required_fields.removeClass('field-highlight')
.filter("[value == '']").addClass('field-highlight')
.length;
return !!stop
Or perhaps more efficient like this?
var stop = required_fields.filter('.field-highlight').removeClass('field-highlight')
.end().filter("[value == '']").addClass('field-highlight')
.length;
return !!stop

Categories

Resources