1. Introdução ao Conhecimento de Introdução ao JavaScript
Observe que o JavaScript é estritamente sensível a maiúsculas e minúsculas! ! ! Cada frase do código precisa ser adicionada com um ponto-e-vírgula no final;
(1) Como escrever código JavaScript
1): Estilo inline: escreva na etiqueta.
<div οnclick = “alert ('Inj 666')”> </div>
2): Estilo inline: escrito em um par de tags <head> </head>.
<head> <script> alert ('Inj 666'); </script> </head>
3): Estilo de link externo: escreva em um arquivo .js separado e importe-o.
<script src = “01-javascript.js”> </script>
ponto importante:
1. O formato em linha não é recomendado.
* 2. Por padrão, a análise da página da web é feita de cima para baixo. Se você usar o estilo inline para escrever o código js no script no conteúdo da tag head, não poderá manipular o conteúdo da página. Existem duas soluções, uma é adicionar window.οnlοad = function ()
{ código javascript; } fora do código javascript original
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript入门1</title>
</head>
<script>
window.onload=function(){ /*等到界面上所有内容都加载完毕，再执行大括号内的东西*/
var oDiv=document.querySelector("div");
var text=oDiv.innerText;
alert(text);
}
</script>
<body>
<div>生活无非是痛苦和美丽</div>
</body>
</html>
3. A terceira solução é escrever o código js na última posição do corpo. *
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript入门1</title>
</head>
<body>
<div>生活无非是痛苦和美丽</div>
<script> /*将代码写在所有代码结束前即body的最后位置*/
var oDiv=document.querySelector("div");
var text=oDiv.innerText;
alert(text);
</script>
</body>
</html>
Observe que importar o código js aqui é equivalente a colar diretamente o código no arquivo js no local correspondente, portanto, tudo o que é necessário é igual ao código escrito diretamente acima.
Além disso, se você escrever o código na tag do script, você não pode chamar o arquivo js
(2) Métodos de saída comuns
1) A forma da janela pop-up:alerta 、 confirmar 、 prompt
Observe que os números podem ser escritos diretamente, mas os não-números devem ser produzidos com aspas duplas / aspas simples.
* alerta janela pop-up comum:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript入门1</title>
</head>
<body>
<script type="text/javascript"> /*将代码写在所有代码结束前即body的最后位置*/
alert("生活无非是痛苦和美丽");
</script>
</body>
</html>
* confirmar janela pop-up (com mais um botão para cancelar):
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript入门1</title>
</head>
<body>
<script type="text/javascript"> /*将代码写在所有代码结束前即body的最后位置*/
confirm("生活无非是痛苦和美丽");
</script>
</body>
</html>
* prompt (uma caixa de entrada adicional é adicionada):
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript入门1</title>
</head>
<body>
<script type="text/javascript"> /*将代码写在所有代码结束前即body的最后位置*/
prompt("生活无非是痛苦和美丽");
</script>
</body>
</html>
2) Saída na forma de conteúdo da web:document.write (conteúdo)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript入门1</title>
</head>
<body>
<script type="text/javascript"> /*将代码写在所有代码结束前即body的最后位置*/
document.write("生活无非是痛苦和美丽！");
</script>
</body>
</html>
3) Saída na forma do console da ferramenta de desenvolvedor:console.log (conteúdo)
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javaScript入门1</title>
</head>
<body>
<script type="text/javascript"> /*将代码写在所有代码结束前即body的最后位置*/
console.log("生活无非是痛苦和美丽！");
console.log(123);
console.warn("错误输出");
</script>
</body>
</html>
2. Sintaxe básica do JavaScript
1. Constantes, variáveis, constantes booleanas
Constante: dados que não podem ser modificados
*Constante inteira： 6… *
Constante real: Qualquer decimal.
Constante de string: Caracteres entre aspas simples ou duplas. 'a' também é uma string
Constante booleana: Existem apenas dois valores, verdadeiro (verdadeiro) e falso (falso)
Constante personalizada(Const fixed constant): Format ----- const constant name = constant value;
b. Variáveis: indicam dados que podem ser modificados
Defina as variáveis:nome da variável var;
== Usar variável: == Armazena dados no espaço de memória adquirido. ----- Nome da variável = Dados a serem armazenados == Obtenha os dados
armazenados na variável: == Basta usar o nome da variável diretamente.
Adição de variáveis:
Modifique a variável diretamente e atribua-a novamente.
Se não for inicializado, indefinido var num é armazenado na memória;
Existem também alguns métodos de atribuição descritos no código a seguir, que é muito semelhante à linguagem C
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>javascript基本语法</title>
</head>
<body>
<script type="text/javascript">
const NUM=666; //常量
console.log(NUM);
var name; //变量
name="生活无非是痛苦和美丽";
console.log(name);
var use="独自美丽"; //定义的时候初始化
console.log(use);
var num1,num2,num3; //同时定义多个变量
var val1=1, vla2=2,val=3; //定义的时候同时初始化多个不同而变量。
val1=val2=100; //也可以同时用一个表达式对多个相同值的变量赋值。
name=123; //修改变量，会直接丢弃旧的值，放入新的值。
console.log(name);
var test; //未初始化的变量
console.log(test);
</script>
</body>
</html>
c. Variável booleana: expressão lógica
//逻辑短路（与、或）
console.log(11||12||0||-1); //逻辑||遇到真就停止，作为最后结果
console.log(0||13||12||-1);
console.log(11&&12&&0&&-1); //逻辑&&遇到假就停止，作为最后结果
console.log(0&&11&&12&&-1);
d. Variáveis e constantes de string
2. Estrutura de dados básica: array, função
(1) Matriz:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>js重要数据结构</title>
</head>
<body>
<script type="text/javascript">
//生成数组的三种方式;
var arr1=new Array(6);
arr1[0]="Romantic"; //数组赋值
console.log(arr1);
var arr2=new Array(1,2,3,4,5,6);
console.log(arr2);
var arr3=[1,2,3,4,5,6];
console.log(arr3);
</script>
</body>
</html>
(2) Função:
a. O formato de criação de uma função estática: (a sintaxe básica é quase igual à da linguagem C)
function 函数名（形参1，形参2，...）{
函数体；
（return 返回值) //可有可无;
}
por exemplo:
//函数
function max(a,b){
var max_a_b;
max_a_b= a>=b? a:b;
return max_a_b;
}
var a=10,b=5;
var max_a_b;
max_a_b=max(a,b);
console.log(max_a_b);
b. Os métodos para chamar a função são:
var myVar=函数名;
myVar(实际参数...);
por exemplo:
var fun1=max;
console.log(fun1(2,100));
c. Há uma variável de argumentos embutida dentro da função para acessar todos os parâmetros passados para a função
Nota: A lista de parâmetros de uma função pode ser qualquer número e o tipo de dados pode ser qualquer tipo. Funções JavaScript naturalmente suportam parâmetros variáveis. JavaScript tem uma variável de argumentos que pode acessar todos os parâmetros passados para a função.
<script type="text/javascript">
/*add函数是一个参数可变的函数*/
function add(){
var result=0;
for(var i=0;i<arguments.length;i++){
//alert(arguments[i]);
result+=arguments[i];
}
return result;
}
alert("add(1,2,3)="+add(1,2,3));//调用add函数时传入3个参数
alert("add(1,2,3,4,5,6)="+add(1,2,3,4,5,6));//调用add函数时传入6个参数
alert("add()="+add());//调用add函数时不传入参数
alert("add(1,\"HelloWorld\")="+add(1,"HelloWorld"));//调用add函数时传入不同类型的参数
</script>
d. javascript cria funções dinâmicas
O formato básico para a criação de funções dinâmicas: var nome da variável = nova Função ("parâmetro 1", "parâmetro 2", "parâmetro n", "instrução de execução");
Observe que aqui é criar um objeto Function e, em seguida, atribuir o objeto ao nome da variável
var sum=new Function("x","y","var sum;sum=x+y;return sum");
alert("sum(3+4)="+sum(3,4));
等价于静态函数：
function square (x,y){
var sum;
sum = x+y;
return sum;
}
e. A diferença entre função estática e função dinâmica:
Podemos ver que cada frase está entre aspas "x", "y" e "var sum; sum = x + y ;; return sum;". Ambas estão entre aspas, o que significa que Cada declaração no os parênteses após a nova Função são colocados entre aspas, o que significa que todas são expressas e chamadas na forma de strings, e as strings podem ser definidas ou alteradas por variáveis, ou seja, podemos definir variáveis para que o valor do variável é igual a estas strings:
<script type="text/javascript">
var a = "var sum;";
var b = "sum = x + y;";
var c = "return sum;";
var square = new Function ( "x", "y", a+b+c);
alert(square (2,3));
</script>
Aqui, definimos as variáveis a, b, c, vamos a = "var sum;", vamos b = "soma = x + y;", vamos c = "retornar soma;"
这样 ： var quadrado = nova Função (“x”, “y”, “var soma; soma = x + y; retorna soma;”);
1) Podemos escrever: var square = new Function ("x", "y", a + b + c); Como a, b e c são três strings, a adição de strings ainda é uma string.
2) Por que dividimos o código em pequenos pedaços de código? , A vantagem de dividir uma string em várias strings independentes é que podemos alterar a função da função a qualquer momento, modificando algumas das strings.
<script type="text/javascript">
var a = "var sum;";
var b = "sum = x + y;";
var c = "return sum;";
var square = new Function ( "x", "y", a+b+c);
alert(square (2,3));
b = "sum = x -y;";//就可以将函数的功能改成减法运算
square = new Function ( " x", "y",a+b+c);
alert(square (2,3));
</script>
No processo de execução do programa, alteramos b = "soma = x + y;"; para "soma = xy;"; dessa forma, colocamos a variável modificada b em var quadrado = nova Função ("X" , "y", a + b + c); em, então ("x", "y", "var soma; soma = x + y; soma de retorno;"); torna-se: ("x", "y" , "var sum; sum = xy; return sum;"); Colocamos nos parâmetros 2 e 3 passados para esta função dinâmica, ela se torna 2-3 e o resultado é -1.
f. Função anônima:
var f1 = function(i1, i2) { //方法一
return i1 + i2;
}
alert(function(i1, i2) { return i1 + i2; }(10,10)); //方法二
alert(f1(1,2));
O uso deste tipo de função anônima é muito em JQuery, declare uma função anônima diretamente e use-a imediatamente. A vantagem de usar funções anônimas é que isso dispensa a necessidade de definir uma função que não é usada uma vez e evita o problema de conflitos de nomenclatura. Não há conceito de namespace em js, então é fácil entrar em conflito com os nomes das funções. os conflitos de nomenclatura, a declaração final prevalecerá.
Nota: JavaScript não suporta sobrecarga de função. JavaScript não diz que não há sobrecarga de método. Se dois métodos tiverem o mesmo nome, mesmo que o número de parâmetros seja diferente, a definição posterior substituirá a definição anterior. Quando o método é chamado, é sempre definido após a chamada.
(3) c.Math (objeto matemático):
Math.abs (...) ------> Pegue o valor absoluto
Math.celi (...) ------> Arredonde
Math.floor (...) ------ > Arredondar
Math .round (...) ------> Arredondar para o número inteiro mais próximo
Math.max (a, b, c, ...) ------> Pegue o valor máximo de vários números
Math.min (a, b, c, ...) ------> Pegue o valor mínimo de vários números
Math.sin (Math.PI / 6) -> Encontre o valor do pecadoSemelhante a outro cos ()
(4) Objeto array array
(1) arr1.concat (arr2);
splicing do array, o resultado é o splicing arr2 ao final de arr1;
(2) arr.join ();
saída da string do array, o símbolo da conexão do elemento pode ser especificado entre parênteses;
eg:
arr=["a","b","c","d"];
console.log(arr.join("|")); (结果为"a|b|c|d")
(3) arr.pop ();
corta o último elemento do array, e o valor de retorno é esse elemento;
(4) arr.slice (início, fim)
1) Obter, obter o fragmento especificado da matriz, iniciar deve ter, se o parâmetro for negativo, selecione a partir do final;
2) O valor de retorno é uma nova matriz composta de fragmento;
(5) arr.push
1) Adicionar, usado para adicionar um novo elemento ao final do array, o parâmetro pode ser múltiplo;
2) O valor de retorno é o novo comprimento do array;
(6) arr.splice
1) é usado para adicionar elementos ao índice especificado na matriz;
arr.splice (2, 0, “William”, “asdfasdf”);
começando do segundo elemento, o número de elementos a serem excluído (você pode 0, de 0 ao final), adicionar elementos como "William", "asdfasdf";
2) Usado para substituir os elementos da matriz;
arr.splice (2,1, "William");
3) Usado para excluir os elementos da matriz;
arr.splice (2,2);
(7) arr.indexOf (elemento);
busca, encontra o elemento na matriz, o valor de retorno é o índice, se não houver tal elemento, retorna -1;
(8) arr.sort (função);
classificar, função é uma função;
eg:
function sortNumber(a,b){
return a-b;
}
arr.sort(sortNumber);(从小到大排序)
tips：如果a-b改成b-a，那么执行的操作为从大到小；
tips:字符串对象（String）的方法与Array的方法类似；
(4) Data data objeto
date.getTime ()
date.getMilliseconds ()
date.getSeconds ()
date.getMinutes ()
date.getHours ()
date.getDay ()
date.getDate ()
date.getMonth ()
date.getFullYear ()
var time=new Date();
alert(time);
var year=time.getFullYear();
var month=time.getMonth();
var day=time.getDay();
alert(year+"-"+month+'-'+day);
dicas: muito, verifique a documentação
(4) Objeto String
charAt (index)
str [index] Pega o caractere na posição especificada da string
concat () concatenando
fatia de string (início, fim) / substring (início, fim) intercepta os caracteres começando do início e terminando no final e retorna uma nova string. Se o início for um número negativo, comece a partir do último caractere;
substr (start, length) intercepta caracteres começando do início e length length para obter uma nova string
indexOf (char) Obtém a primeira posição do caractere especificado na string
lastIndexOf (char) Obtém a última posição do caractere especificado na string
trim () remove o espaço em branco antes e depois da string
toUpperCase ()
toLocaleUpperCase () converte em maiúsculas
toLowerCase ()
toLocaleLowerCawse () converte em minúsculas
replace () substitui a
divisão de caractere () divide a string em uma matriz