Javascript Turtle. Create a JavaScript array containing 1...N. Learning much javascript from one line of code - arqex. Since javascript is everywhere nowadays, it is really easy to learn new stuff everyday.
Once you know the basics of the language, you can take bits of code from here and there that have a lot of knowledge in them. Bookmarklets are perfect examples of a bunch of packed functionality, whenever I discover a useful one, I enjoy studying their source, discovering how it can do so much. Also snippets to use external services, like the google analytics code, or facebook likebox, can teach us more than some books. Today I want to break in pieces a one-liner code that Addy Osmani shared a few days ago that can be used to debug your CSS layers. Here it is, in 3 lines to fit in the post: [].forEach.call($$("*"),function(a){ a.style.outline="1px solid #"+(~~(Math.random()*(1<<24))).toString(16) }) Try to type it in your browser console, and the different layers of HTML that there are in the web page will be highlighted in different colors.
Selecting all the elements of a page It is great! Scary uh? The 11 JavaScript Mistakes you’re Making. DOM: element IDs are global variables. Several tweets mentioned that in order to display an element in Chrome’s JavaScript console, you only have to type its ID.
@johnjbarton pointed out that that is because all element IDs are global variables. This blog post explains a few more details. The standard The HTML5 standard specifies that the window object must have a property key whose value is elem if... There is exactly one DOM element elem whose property id has the value key. Thus, the div element above can be accessed either via window.foo or, like all properties of window, via the global variable foo. > "foo" in window true > foo <div id="foo"></div> Firefox Firefox (version 14) works slightly differently. > "foo" in window false > typeof foo // does the variable exist?
What does that mean? [Note: the code above can only be executed via a script tag, but not via the console. Whenever you read foo, the div element is returned and a warning tells you not to do that. Updates. Basic JavaScript: an introduction to the language. This blog post enables you to get started with JavaScript as quickly as possible – if you already know how to program.
It describes the smallest subset of the language that allows you to be productive. I call that subset “Basic JavaScript” and recommend to program in it for a while, before moving on to more details and advanced topics. Learning everything at once is too confusing. The post concludes with tips for what to learn next. Warning: Below, I’m describing rules of thumbs and best practices. Table of contents Conventions used in this blog post Command line interaction Whenever I introduce a new concept, I also try to illustrate it via an interaction in a JavaScript command line. The Value of valueOf. ValueOf is a radically underused part of Javascript.
It gives you some control over comparison of your custom object types within your application. This allows you to keep your code short, readable and natural - especially if you use a lot of value objects. Any object which has a valueOf function available can play. valueOf is simple: it should return a primitive representation of the object’s value. function Node(weight) { this.weight = weight } Node.prototype.valueOf = function() { return this.weight } var a = new Node(15) var b = new Node(10) var c = new Node(25) assert( a > b ) assert( b < a ) assert( c > a && c > b ) Javascript will use the valueOf method whenever an object is in a position it should be converted to a primitive - comparison operations or arithmetic where other primitives are concerned, or in inequalities between objects.