## 11 Pseudo-Selectors

Sizzle, the CSS Selector engine inside jQuery, offers quite a few pseudo-selectors to make the job of selecting the elements you want easy. Check out these interesting ones:

There are more, of course, but these are the unique ones.

## 12 isArray() / isEmptyObject() / isFunction() / isPlainObject()

Sometimes you want to make sure the parameter that was passed to a function was the corrent type; these functions make it easy to do. The first three are pretty self explanatory:

The next one isn't as obvious; isPlainObject() will return true if the parameter passed in was created as an object literal, or with new Object().

## 13 makeArray()

When you create a collection of DOM elements with jQuery, you're returned a jQuery object; in some situations, you might prefer that this be an array or regular DOM elements; the makeArray() function can do just that.

## 14 map()

The map() method is remotely similar to grep(). As you might expect, it takes one parameter, a function. That function can have two parameters: the index of the current element and the element itself. Here's what happens: the function that you pass in will be run once for each item in the collection; whatever value is returned from that function takes the place of the item it was run for in the collection.

## 15 parseJSON()

If you're using $.post or $.get—and in other situations that you work with JSON strings—you'll find the parseJSON function useful. It's nice that this function uses the browsers built-in JSON parser if it has one (which will obviously be faster).

## 16 proxy()

If you have a function as a property of an object, and that function uses other properties of the object, you can't call that function from within other functions and get the right results. I know that was confusing, so let's look at a quick example:

By itself, person.meet() will alert correctly; but when it's called by the event handler, it will alert "Hi! My name is undefined." This is because the function is not being called in the right context. To fix this, we can use the proxy() function:

The first parameter of the proxy function is the method to run; the second is the context we should run it in. Alternatively, we can pass the context first, and the method name as a string second. Now you'll find that the function alerts correctly.

Prefer a video quick tip on \$.proxy?

## 17 replaceAll() / replaceWith()

If you'd like to replace DOM elements with other ones, here's how to do it. We can call replaceAll() on elements we've collected or created, passing in a selector for the elements we'd like to replace. In this example, all elements with the error class will be replaced with the span we've created.

The replaceWith() method just reverses the selectors; find the ones you want to replace first:

You can also pass these two methods functions that will return elements or HTML strings.

## 18 serialize() / serializeArray()

The serialize() method is what to use for encoding the values in a form into a string.

HTML

JavaScript

You can use serializeArray() to turn the form values into an array of objects instead of a string:

## 19 siblings()

You can probably guess what the siblings() method does; it will return a collection of the siblings of the whatever items are in your original collections:

## 20 wrap() / wrapAll() / wrapInner()

These three functions make it easy to wrap elements in other elements. First off, I'll mention that all three take one parameter: either an element (which is an HTML string, a CSS selctor, a jQuery object, or a DOM element) or a function that returns an element.
The wrap() method wraps each item in the collection with the assigned element:

The wrapAll() will wrap one element around all the elements in the collection; this means that the elements in the collection will be moved to a new spot in the DOM; they'll line up at the place of the first element in the collection and be wrapped there:

HTML, Before:

JavaScript

HTML, After:

Finally, the wrapInner function wraps everything inside each element in the collecting with the given element:

HTML, Before:

JavaScript:

HTML, After:

## Conclusion

Well, now you've got more than twenty new jQuery features to play with on your next project; have fun with them!