SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    823
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)

    pls explain this construction....

    please explain this construction.....

    Code:
    localStorage = (function () {
    	return {
    		setItem: function (key, value) {
    		createCookie(key, value, 3000) 
    	},	//	setItem
    	getItem: function (key) {
    		return(readCookie(key));
    	}	//	getItem
    };	//	return
    
    }	//	function closed here )	//	why is this fn inside parens?
    
    ();	//	 what is this for?

    why is the function after "localStorage =" enclosed in parens?

    and what is the " (); " at the end for?

    thank you...

  2. #2
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Hi Maya90,

    This is called the Module Pattern

    Basically the function is enclosed in parens to enclose it and turn it into a function expression (if it didn't have the parens it would be a function statement).

    The extra set of parens at the end execute the expression so that the return statement will pass it's returned value to the variable on the outside of the expression.

    I could go on explaining, but if you read the links I posted below, you'll get a much more in-depth explanation than I could possibly put in this post


    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  3. #3
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Due to confusion such as this, it is better for the function parenthesis to be inside of the enclosing parenthesis, which helps to make it clearer what is happening.

    Code javascript:
    localStorage = (function () {
        ...
    }());
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  4. #4
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    823
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thank you for both replies....

    AussieJohn, I love Australia, I've been there.. wish I were there now.. wish I lived there....

    I love your "details" object... ;-) last night I clicked to your "psa" and downloaded Chrome and Opera for my iPhone.. (found out just recently can run browsers other than Safari on the iPhone...) to my horror discovered Opera is not good at all... doesn't support rounded corners... drop shadows look abysmal...

    thanks again...

  5. #5
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Maya: Australia is pretty sweet (I hear New Zealand is pretty rad too, never been thuogh. Paul might be able to tell us )

    Browsers on the iPhone other than Safari run with less privileges than the native browser I think, though I suppose they would give a decent enough browsing experience. (Though like you said, drop shadows don't look good, so maybe it doesn't get access to hardware rendering.)

    I think one of the issues with a lot of newer sites is that people tend to only use the -webkit- CSS prefix and the no-prefix version of CSS properties, which results in some browsers like older Mozilla, Opera, Opera Mini, etc to not show the property properly. We had a discussion about it in the CSS forum a while back.
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }

  6. #6
    SitePoint Guru
    Join Date
    Jun 2009
    Posts
    823
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    thank you Aussie... a bit off-topic, but since you responded to my Opera comment...

    this is what I use for rounded corners, to cover all my bases, is this correct? it looks like it doesn't cover Opera...

    Code:
    -moz-box-shadow: 6px 6px 6px #6E3804; -webkit-box-shadow: 8px 8px 8px #6E3804; box-shadow: 2px 2px 2px #AB8159;
    thank you...


    Edit: PS: here, http://www.css3.info/preview/rounded-border/
    that gray box that it says it's supposed to have rounded corners also on Opera, on Opera in my iPhone the corners are not rounded... :-(
    oh well... for another thread, I suppose.....

  7. #7
    Unobtrusively zen silver trophybronze trophy
    paul_wilkins's Avatar
    Join Date
    Jan 2007
    Location
    Christchurch, New Zealand
    Posts
    14,718
    Mentioned
    103 Post(s)
    Tagged
    4 Thread(s)
    Quote Originally Posted by maya90 View Post
    this is what I use for rounded corners, to cover all my bases, is this correct? it looks like it doesn't cover Opera...
    That's fine, Opera supports box-shadow too. See http://peter.sh/experiments/vendor-p...erty-overview/

    This prefixing tool can help to simplify some of work that needs to be done too - http://cssprefixer.appspot.com/
    Programming Group Advisor
    Reference: JavaScript, Quirksmode Validate: HTML Validation, JSLint
    Car is to Carpet as Java is to JavaScript

  8. #8
    Under Construction silver trophybronze trophy AussieJohn's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    776
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by maya90 View Post
    thank you Aussie... a bit off-topic, but since you responded to my Opera comment...

    this is what I use for rounded corners, to cover all my bases, is this correct? it looks like it doesn't cover Opera...
    I just had a quick look and it doesn't look like Opera Mini supports those properties, the main Opera browser does however. (http://caniuse.com/#search=border-radius)

    If you want to truly make sure that you capture the majority of browsers you'll have to include all the prefixes.

    Code:
    -webkit-border-radius:4px;
    -moz-border-radius:4px;
    -ms-border-radius:4px;
    -o-border-radius:4px;
    border-radius:4px;
    var details = {
    . . web: "afterlight.com.au",
    . . photos: "jvdl.id.au",
    . . psa: "usethelatestversion.com"
    }


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
  •