Weird commands in the book Eloquent JavaScript [duplicate] - javascript

This question already has answers here:
show() is not defined
(4 answers)
Closed 9 years ago.
My question is with regards to the popular book "Eloquent JavaScript."
It seems to be a very popular book and appears to be on most "recommended reading" lists for people that wish to learn JS. After starting to read the book, I can certainly understand why: the author is an excellent writer and has a knack for explaining things in a very clear and concise way. What confuses me are the commands he often calls, in the first little bit he uses
Print("hehehe")
and
Show(sum(range(1,10)))
to add all numbers from 1 to 10. But none of those commands appear to be consistent with other tutorials and dont work when I try to run them.
What the heck is going on?! Has the language changed THAT much since the book was published in 2007?
Thanks guys and I apologize if this questions is a dumb one.

Are you using the web version of the book? He explains in chapter 2:
As the previous examples show, alert can be useful for showing the result of some expression. Clicking away all those little windows can get on one's nerves though, so from now on we will prefer to use a similar function, called print, which does not pop up a window, but just writes a value to the output area of the console. print is not a standard JavaScript function, browsers do not provide it for you, but it is made available by this book, so you can use it on these pages.
A similar function, also provided on these pages, is show. While print will display its argument as flat text, show tries to display it the way it would look in a program, which can give more information about the type of the value. For example, string values keep their quotes when given to show:

Related

Making a countdown clock that resets and changes the page content

I'm slowly learning to implement Javascript into my websites to generate automated changes, actual code is scary for my graphic designer approach but I think I'm getting there.
I followed an exercise some time ago that had me make a countdown clock that resets every time it reaches 0, nothing to crazy but it got me thinking:
Is there any way to make that reset affect the content of the entire page?
The practical case that made me think of it is the website of a restaurant that has a different coupon every day of the week, they upload the coupon code to their social media everyday but if I could develop a site that loops the codes depending on the day and make it change the text content and the stylesheet on it's own the process would be automatic.
I can't figure out how you'd link the clock reset to that change though, tried searching for it and I think this might be solved with some AJAX shenanigans, but it seems to be a bit too specific to find, any guidance would be greatly appreciated.
Hi and welcome to stackoverflow. This is a very general question. It is hard to answer without specificity that requires knowledge the community doesn't have. For example:
When you say "I followed an exercise some time ago...", what did the code look like? What was your final product? How is JavaScript used?
When asking a question in stackoverflow, it can be helpful to share a snippet of what the code looks like so that others can help by testing the code themselves and giving feedback. Or at the very least observing the functionality and maybe catching small syntax errors.
To the second point of "Is there any way to make that reset affect the content of the entire page?" Yes. There are MANY MANY MANY ways to affect content of a page, either in pieces or in its entirety. Once again it depends on what you want to do with the code that YOU have specifically. Even with the basic tools of HTML and JavaScript you can do this. You don't need "AJAX shenanigans" LOL.
If you are just starting out, dig deep into the basics of JavaScript(if that is your preferred language). You will find a whole host of versatile functionality through creating objects, methods, manipulating the DOM, building your own event handlers, etc. Also if none of what I just wrote makes any sense, then you now have some terms worth researching on your own.
I hope that this is helpful for you, and I wish you the best of luck on your coding journey.

Generate a diagram or schema that shows the relationships between all the files in a website

The last 9 months, I've been working on two big websites with PHP and Javascript without using any framework.
Every time I wanted to modify a page or fix a bug, I was spending:
10% of the time on finding the PHP file with the html content
20% of the time on locating the CSS and JavaScript files it is using
20% of the time on locating the PHP classes it's using and the functions and variables it's inheriting
20% of the time on locating all the scripts that are being called through ajax calls.
And only 30% percent of the time to actually fix the problem.
So, I wanted something that for every file that I want to modify within a project, after indexing all the aforementioned, it shows a list with all of these relationships on a diagram/flowchart along with the corresponding links to these files.
After a lot of Googling I couldn't find anything that directly solves this problem effectively. Right now, except for just opening all the includes inside the PHP file one by one, I am using Google Chrome's Inspector to quickly locate the includes from the Network tab or even add my whole Workspace in the Sources tab in order to apply CSS and JavaScript modifications directly from there. The problem with this, is that I don't have any options for locating any server-side code(PHP). Also I don't want to be dependent on any specific Web-Browser. Lastly, this solution doesn't provide me any graphical representation of the website's schema, something that's really important for understanding in seconds the whole structure of a webpage that you are going to modify for the first time.
I know that this question sounds a little off-topic but I couldn't find anything on the Web (maybe I didn't use the correct search keywords?) and I feel like it's something that a lot of developers struggle with sometimes so it could be really helpful if it's answered and stay visible. Even if I am missing the point due to luck of experience and there is a different approach to this kind of problems, I don't think I am the first one and It could be also good to be clarified for all the others out there.
I can't help you with the diagram part of your question but I understand that your problem is indexing.
You could use sublime which more or less work with all the operating systems and at the same time it's quite light. With it you will have indexing as you can see here.

Realtime math input in browser

This is a follow up to a previous, unanswered question of mine.
Goal: an input field in a web page (the general sense, not a form specifically) where input of certain patters, such as $\int$, will render math - an integral sign in this case, within the field itself, not in a separate preview box.
In the linked question I linked to a conteneteditable div implementation with MathJax I attempted, but failed (works somewhat on IE, which doesn't count). Please no lip on how contenteditable is terrible, I know this very well now.
I came across the IXL website, which they have an interesting implementation which works nicely for superscripts and fractions (at least). After answering a few questions you get a toolbar, but you can type Shift+^ to see a superscript immediately.
I think I can expand this for other things I need, but I'm not sure what in their code does this - it looks like a canvas, but I'm not sure, and I was hoping someone smarter can recognize immediately what they're using. The source of the page has the JS.
I've posted on MathJax GitHub and some other tools to advance a solution, but currently no one has this functionality properly (only the 'preview' box).
SO is my final attempt - the diversity of people here hopefully can get me started. I just need to focus my reading - the first lines of code, how is a fraction rendered as that box over line over box in the input field.
I apologize for not posting code of my own, my previous question was my best attempt so far.
As per jiggzson's suggestion, I checkout out Guppy, forked it and it's awesome (as far as my needs). You can check my fork at https://github.com/uperetz/guppy. I'll post my latest demo there now. Current branch is textmix but I'm hoping Daniel will merge to master.

what, if browser has javascript disabled, ( AngularJS) [duplicate]

This question already has answers here:
How to handle JavaScript being disabled in AngularJS
(2 answers)
Closed 8 years ago.
I have learned angular.js, and it's awesome , i'm impressed. i want to use it in my website, but what if our some of user has disabled JavaScript on there browser, they should still gonna see my website content ?????. i'll appreciate your help.
In most cases when js is required, you should add noscript which will be displayed when js is disabled. In that tag you need to warn user that he/she should enable js.
In addition to other answer, I am quoting from Angular book:
Not everyone’s browser supports JavaScript. Let everyone see all of your content and use your app without needing to execute code in the
browser.
The world has changed since these concepts were born. Point #1 is no
longer true for any interesting population. If you’re running a
browser without JavaScript, you’re rele‐ gated to sites created in the
1990s
Or make a div with a warning/notice text (maybe in center of page), and hide that div in js (first thing in your code)
So, if the user does not have js enabled, they will see the nice warning

Facebook (1) - Update Browser Title With New Notification Number [duplicate]

This question already has answers here:
Closed 11 years ago.
Possible Duplicate:
How can I update the title of the tab in the same way GMail/Facebook does?
How is it possible to update my browser title value, like Facebook and Yahoo, to show a number that represents notifications/pending items/new messages etc.
Right now, my Facebook page title/tab reads [ (3) Facebook ], which indicates I have 3 unread notifications.
How is this possible? I reckon it uses JS and AJAX but I maybe wrong. Has anybody got any snippets, links or suggestions that will get me started in this?
It's a really nice feature but don't seem to find many websites using it, neither can I find any decent tutorials or examples.
Many thanks
It's just a property of the document object
document.title = "some string";
Use whatever logic you like to determine what information you want to put in there.
Be aware that it will produce some really odd bookmark names.
You just need to change title of your page using javascript.
if you are using jquery, it is as simple as -
$('title').text('someText (3)')

Categories