If you pass a value that is an attribute itself on the container to the components they should share the same reference and updates to one will affect the other.
For example:
<aura:component>
<aura:attribute name="containerSubj" default="abcd" type="String" />
<ns:foo subject="{!v.containerSubj}"/>
<ns:bar subject="{!v.containerSubj}"/>
</aura:component>
Then in the foo component:
<aura:component>
<aura:attribute name="subject" type="String"/>
<div>foo: {!v.subject}</div>
</aura:component>
And the bar component, but let's add a button to change the value when pressed:
<aura:component>
<aura:attribute name="subject" type="String"/>
<div>bar: {!v.subject}</div>
<ui:button press="{!c.changeSubject}" label="Change the Subject"/>
</aura:component>
Then in the barController:
({
changeSubject : function(component, event, helper) {
component.set("v.subject", "xyz");
}
})
That should update the output to be the following when the button is pressed:
foo: xyz
bar: xyz
If on the other hand you just did something like the following they would be independent:
<aura:component>
<aura:attribute name="containerSubj" default="abcd" type="String" />
<ns:foo subject="abcd"/>
<ns:bar subject="abcd"/>
</aura:component>
And, clicking the button would result in:
foo: abcd
bar: xyz
It seems to me like this approach of letting the container control it would be the way to go because it leaves the components themselves decoupled and leaves it up to the container using them to decide if it wants to implement it that way or not.
So internally to Salesforce we tell people to not use jQuery, just go straight to the DOM.
var subComponents = component.getElement().querySelectorAll(".some-selector");
If you wanted to use jQuery with that you could
var jquerySubComponents = $(subComponents);
If you didn't want to (or couldn't) do that, then you could assume the className of your component based on convention.
<stackexchange:example/>
var myCmp = $(".stackexchangeExample");
But this will get you all the instances of the component on the page, which could be more than you expected. (Someone else using it in another part of the page?)
Best Answer
It is used to set the styling on the component and set the input to required. Browsers handle the required attribute in different ways but it does signify to the browser that that input must be filled out before submitting the document to the server
You can also roll your own validations on the fields using jQuery, JS, etc on all "input:required" fields using the attribute. Not much different from when you did it in VF