javascript O aprendizado de
javascript pode ser dividido em 3 partes diferentes: Núcleo (ECMAscript), Objeto de Texto (DOM), Objeto de Navegador (BOM)
Núcleo (ECMAscript): Palavras-chave, Instruções, Operadores, Objeto
Objeto de Texto (DOM): DOM planejará o página inteira em um documento composto por níveis de nós.
A análise segue o padrão html dom W3C:
A referência dom W3C presta atenção especial à descrição do nó DOM,
objeto do navegador BOM, novo navegador pop-up, tamanho da configuração do navegador.
Core (ECMAscript) Objeto integrado global;
Métodos: parseInt(), isNan(), encodeURI()...etc são todos métodos deste objeto.
Preste atenção especial a eval(); um símbolo de linguagem dinâmica como: eval("alert('hi')");
Descrição do objeto de texto (DOM):
<bookstore> <bookcategory="cooking"> <title lang="en">Italiano do dia a dia</title> <author>Giada De Laurentiis</author> <ano>2005</ano> <price>30,00</price > </book> </livraria>
1. Fundamentos do ECMAscript
$ Designação de tipo fraco da variável húngara: var iOuouValue=100;
$ pode terminar a linha com ou sem ponto e vírgula; mas então onsubmit="javascript:function();return false;
"
"typeof" var test=1; alert(typeof testX); //saída "indefinido"
"NaN" - não é um número -> isNan("blue"); ; //saída "falso"
$ objeto; var o = new Object();
uma
função que normalmente escrevemos é um objeto.
Este var a = {name:"Liu Kaiyi"} é equivalente a var a = function(){this.name="Liu Kaiyi"};
name:"test" ,pass:"123456",addr:"bj"} //O que é isso? ! json
Quando var str = '{name:"test",pass:"123456",addr:"bj"}'
var objectBean = eval(str); //Aqui está o objeto objectBea.name usando
o conceito de domínio:
<SCRIPT type; =texto/javascript>
var sMessage = 'Olá';
function setAlgo() {
sCor = 'vermelho';
sMessage = 'Olá mundo!';
}
setAlgo();
alert(sMessage); //Olá mundo!
alerta(sColor); //vermelho
</SCRIPT> <SCRIPT type=text/javascript>
var sMessage = 'Olá';
function setAlgo() {
var sColor = 'vermelho';
sMessage = 'Olá mundo!';
}
setAlgo();
alert(sMessage); //Olá mundo!
alerta(sColor); // nada
</SCRIPT>
<SCRIPT type=text/javascript>
var sMessage = 'Olá';
function setAlgo() {
var sColor = 'vermelho';
var sMessage = 'Olá mundo!';
}
setAlgo();
alerta(sMensagem); //Olá
alerta(sColor); // nada
</SCRIPT>
Estabelecendo as bases para a orientação a objetos: aplicação de objetos do tipo protótipo de objeto. Referência
// A herança mais simples
Object.prototype.inObj = 1;
função A()
{
isto.inA = 2;
}
A.prototype.inAProto = 3;
B.prototype = new A; // Conecta A na cadeia de protótipos de B
B.protótipo.construtor = B;
função B()
{
isto.inB = 4;
}
B.prototype.inBProto = 5;
x = novo B;
document.write(x.inObj + ', ' + x.inA + ', ' + x.inAProto + ', ' + x.inB + ', ' + x.inBProto)
; , 5
//Aumentar um pouco de confiança http://www.json.org/json.js
Object.prototype.toJSONString = function (filter) { return JSON.stringify(this, filter }); não é?
$ argumentos;
função getFun(){alert(argumentos.comprimento);} ;
getFun("xx") //saída 1
getFun("xx",23) //saída 2
$ instrução; sob instruções especiais for
(var i=0i<iCount;i++) ou for(attr in object);
Se você está entediado, você pode for( sProp in window ){alert(sProp+"Hey, please!");} //Veja o reflexo do javascript
Orientado a objetos:
var bean = new Bean();
Função
do método de fábrica
getAttr(){alert(this.attr)
}
function Bean(tattr){
var
bean = new
Object
;
}
É basicamente uma versão imitadora da orientação a objetos
2. Construa
a função Bean(tattr){
this.attr = tattr;
bean.getAttr = function(){
alert(this.attr);
Acima
de
2, quando o objeto Bean for criado, o método "gerará repetidamente a função". "!
3. Função do modo protótipo
Bean(){}
Bean.prototype.attr =
"";
Resolva o problema da "função gerada duplicada", mas novo problema Bean.prototype.getArray = new Array();
Seus novos objetos bean1 e bean2 compartilharão o novo espaço Array (que não queremos ver)
4. Modelo misto:) Haha
function Bean(){
this.attr= "";
this.getArray=nova matriz;
}
Bean.prototype.getAttr=function(){alert(this.attr);}
5. Protótipo dinâmico (observe que a partir de agora ele é verdadeiramente orientado a objetos!!!)
function Bean(){
this.attr= "";
this.getArray=new Array;
//classload ao carregar
if(typeof Bean._initialized == "indefinido" ){
Bean.prototype.getAttr=function(){alert(this.attr);};
Bean._initializado= verdadeiro
}
}
/********************************************** ********************/
Herança de objeto
1. Personificação de objeto! ! (Pode suportar herança múltipla, o copycat é muito poderoso)
function classA(sstr){
this.color = sstr;
this.sayColor = function(){
alert(this.color);
};
}
função classeC(){}
função classB(){
this.newMethod =ClassA;
this.newMethod()
;
this.newMethod =ClassC;
this.newMethod()
;
isto.arrt = "google";
}
2.call() apply() também é um imitador,
function classA(sstr){
this.color = sstr;
this.sayColor = function(str){
alert(str+this.color);
};
}
function classB(){
// this.newMethod =ClassA ;
// this.newMethod();
//
excluir this.newMethod
;
"vermelho"))
isto.arrt = "baidu";
}
3. Cadeia de protótipos de herança ortodoxa (mas não suporta herança múltipla)
função classA(){this.oo="test";}
classA.prototype.color = "vermelho";
função classeB(){}
classB.prototype = nova classeA;
classB.prototype.sayName=função(){
alerta( this.color );
}
varbb = nova classeB;
bb.sayName(); // saída vermelha
alert(bb.oo); //saída de
alerta de teste(bb instanceof classA);
alerta(bb instância da classeB); //saída verdadeira
4. Se você quiser mais herança! ! E também suporta instanceof
Método de mistura:
função classeA(){}
função classeB(){}
função classeC(){
classA.call (isto);
classC.call (este);
}
classC.prototype = new classA;//Observe que instanceof só pode ser usado para A