SitePoint Sponsor

User Tag List

Results 1 to 10 of 10

Hybrid View

  1. #1
    SitePoint Zealot
    Join Date
    Oct 2006
    Posts
    153
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Need info on this default function argument system.

    Hi
    I recently revisited the pagewhich has on it "The Ultimate getElementsByClassName" and there is an updated version of this function there which has default arguments. I tested this new version and it worked just fine, however I did not understand how the default arguments worked in the code. And I do not know how to search for a reference on the Web for the lines I do not understand. So I would appreciate it if you could point me to a reference which explains the lines I have mocked in Orange in the code I am posting below.

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
        <title>get class</title>
    <script type="text/javascript" charset="utf-8">
    function getElementsByClassName(className, tag, elm){
    	var testClass = new RegExp("(^|\\s)" + className + "(\\s|$)");
    
    	var tag = tag || "*";
    	var elm = elm || document;
    
    	var elements = (tag == "*" && elm.all)? elm.all : elm.getElementsByTagName(tag);
    	var returnElements = [];
    	var current;
    	var length = elements.length;
    	for(var i=0; i<length; i++){
    		current = elements[i];
    		if(testClass.test(current.className)){
    			returnElements.push(current);
    		}
    	}
    	return returnElements;
    }
    
    window.onload=function(){
    var  arrRedClass=getElementsByClassName("redClass");	 
    var a = arrRedClass[0];
    var b = arrRedClass[1]; 
    a.style.backgroundColor="red";
    b.style.backgroundColor="red";
    }
    </script>		
    </head>
    <body>
    <p class="redClass">red </p>
    <p>no red</p>
    <p class="redClass">red </p>
    <p>no red</p>
    </body>
    </html>

  2. #2
    SitePoint Zealot elated's Avatar
    Join Date
    Dec 2004
    Location
    Sydney, Australia
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Those orange lines are saying:

    1. Set the "tag" local var to the value of the "tag" argument in the function call. If the argument in the function call was not supplied, set it to "*" (all tags) instead.

    2. Set the "elm" local var to the value of the "elm" argument in the function call. If the argument in the function call was not supplied, set it to the "document" object instead.

    Matt

  3. #3
    SitePoint Zealot
    Join Date
    Oct 2006
    Posts
    153
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK
    I kind of figured out that that was what it was saying, but that wasn't my question.. My question is what is this syntax is not a "if statement" or "ternary operator:". Or at least this is not any type of "ternary operator" syntax I am familiar with, perhaps it is some sort of ternary operator shorthand or something like that.. So where can I find out more about the statement syntax used here? I am sure you are right that that's what it means, but where is this syntax documented? I do not know what is being done in those lines are called. So I do not know how to do a Google search on it or where to look it up in a reference. I would not be comfortable in using this type of code it my own code just on my own assumptions and in what was said here.

    Sincerely
    Marc

  4. #4
    SitePoint Enthusiast
    Join Date
    Aug 2006
    Posts
    41
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    it's a logical OR operator. In logic, the statement (A OR B) evaluates to true if either A is true, B is true, or both are true.
    In javascript, it's slightly different, in that the result of (A || B) is:
    * A if A doesn't loosely evaluate to false
    * B if A does loosely evaulate to false

    By that, I mean that if A is 'undefined', null, false, '' or 0 (there might be other things, but these are the most common) then B will returned. If A is anything else, then it will be returned.

  5. #5
    SitePoint Zealot
    Join Date
    Oct 2006
    Posts
    153
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    So are you saying this is normal operation for the or (||) operator in JavaScript like even the way it works inside and "if statement"? And if this is what you're saying is it just JavaScript or most computer languages?

  6. #6
    SitePoint Zealot elated's Avatar
    Join Date
    Dec 2004
    Location
    Sydney, Australia
    Posts
    117
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, it works in the same way as it does inside an if statement.

    It returns the value of A if A evaluates to true. If A evaluates to false, it returns the value of B (which may also evaluate to false).

    So if neither A or B evaluate to true, it returns false. (And your if statement would fail.)

    Not all languages behave like this. Java and C++, for example, only return a boolean value (true or false), not the value of one of the operands.

    Matt

  7. #7
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    gjones is correct. I should mention that when "A" evaluates to true, "B" won't be evaluated at all.

    Yes, this is how the "||" (logical or) operator normally works.

    You can do this in PHP as well. (PHP allows "or" and "||" to be used.)

    This is fairly common in PHP:
    Code:
    $result = mysql_query($query) or die('some error message');
    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.

  8. #8
    SitePoint Enthusiast
    Join Date
    Mar 2007
    Posts
    25
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    There's a lot of good advice here. Just one point that I think is worth noting (although it's probably dead clear by now):

    a='test';
    b=false;

    a || b this evaluates to either a or b or false.

    when used in this case:

    if (a||b) this evaluates, first, to: if (a)

    and then 'a' evaluates to 'true.' That two evaluations are going on is a subtle distinction that I think is helpful to understand.

    Quote Originally Posted by Kravvitz View Post
    gjones is correct. I should mention that when "A" evaluates to true, "B" won't be evaluated at all.

    Yes, this is how the "||" (logical or) operator normally works.

    You can do this in PHP as well. (PHP allows "or" and "||" to be used.)

    This is fairly common in PHP:
    Code:
    $result = mysql_query($query) or die('some error message');
    Hi Kravvitz,

    Correct me if I'm wrong, but I think that the situation is slightly different here.

    Your particular case, I believe, takes advantage of the fact that OR's operands are evaluated lazily. If A fails, then B is evaluated. If A succeeds, B is ignored, like you said.

    But this particular topic is about what the -entire- operation evaluates to. With PHP, the OR operation always evaluates to a boolean. Here's an example:

    PHP: echo 'test' || false;

    JavaScript: alert('test' || false);

    With PHP you'll get a boolean, with JavaScript, you'll get 'test.' With your particular example, the same code (the general idea) could be used in both JavaScript and PHP and work in the same way. However, if you tried assigning the result of that operation to a variable and later attempted to manipulate that variable, you might be in for a few surprises .

    You might know everything I'm talking about (and I could be wrong), but again I thought it would be helpful to clarify, especially within the context of the thread and the original question.

  9. #9
    SitePoint Zealot
    Join Date
    Oct 2006
    Posts
    153
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks guys -I think I actually have read all that you said here, but I couldn't realize the implications of all I have read without asking the question. So thanks.

  10. #10
    CSS & JS/DOM Adept bronze trophy
    Join Date
    Mar 2005
    Location
    USA
    Posts
    5,482
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    synotic, you're right. Thanks for pointing that out. I hadn't tried that in PHP except for the special case I used as an example before because PHP allows setting default values for function arguments [1], which JavaScript does not. (In case anyone is wondering, in the PHP example synotic posted results in "1" being outputed by the script.)

    [1]
    PHP Code:
    function myFunction($str='this is a string'){
      echo 
    $str;

    We miss you, Dan Schulz.
    Learn CSS. | X/HTML Validator | CSS validator
    Dynamic Site Solutions
    Code for Firefox, Chrome, Safari, & Opera, then add fixes for IE, not vice versa.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •