JS (JavaScript)基础语法整理

160 阅读3分钟

「这是我参与11月更文挑战的第9天,活动详情查看:2021最后一次更文挑战

JavaScript 是 Web 的编程语言。

所有现代的 HTML 页面都使用 JavaScript。

document 记录;文件

inner 内部的 element 元素

console 安慰; 控制台

snippets 片段

JavaScript输出

显示数据

  • 使用 window.alert() 弹出警告框。
  • 使用 document.write() 方法将内容写到 HTML 文档中。如果在文档已完成加载后执行 document.write,整个 HTML 页面将被覆盖
  • 使用 innerHTML 写入到 HTML 元素。
  • 使用 console.log() 写入到浏览器的控制台。

操作HTML元素

document.getElementById("demo").innerHTML = "段落已修改。"; //向id = “demo”的HTML元素输出文本

JavaScript语法

字面量

document.getElementById("demo").innerHTML = 123e5;
document.getElementById("demo").innerHTML = 'John Doe';
document.getElementById("demo").innerHTML = 5 * 10;
[40, 100, 1, 5, 25, 10] //数组
{firstName:"John", lastName:"Doe", age:50, eyeColor:"blue"} //对象
function myFunction(a, b) { return a * b;} //函数

变量

var length;
length = 6;
document.getElementById("demo").innerHTML = length;
document.getElementById("demo").innerHTML = (5 + 6) * 10;
x = 5;
y = 6;
z = (x + y) * 10;
document.getElementById("demo").innerHTML = z;
​
​
类型实例描述
赋值,算术和位运算符= + - * /在 JS 运算符中描述
条件,比较及逻辑运算符== != < >在 JS 比较运算符中描述

关键字

var 创建变量

var length = 16;                                  // Number 通过数字字面量赋值
var points = x * 10;                              // Number 通过表达式字面量赋值
var lastName = "Johnson";                         // String 通过字符串字面量赋值
var cars = ["Saab", "Volvo", "BMW"];              // Array  通过数组字面量赋值
var person = {firstName:"John", lastName:"Doe"};  // Object 通过对象字面量赋值
document.write("你好 \
世界!"); //可以使用\对代码进行换行

未使用值来声明的变量,其值实际上是 undefined

JavaScript拥有动态类型

var x;               // x 为 undefined
var x = 5;           // 现在 x 为数字
var x = "John";      // 现在 x 为字符串
var answer="It's alright";
var answer="He is called 'Johnny'";
var answer='He is called "Johnny"';
var cars=new Array(); // 数组
cars[0]="Saab";
cars[1]="Volvo";
cars[2]="BMW";
​
//对象
var person=
{
    firstname : "John",
    lastname  : "Doe",
    id        :  5566
};
document.write(person.lastname + "<br>");
document.write(person["lastname"] + "<br>");
​
//Undefined 这个值表示变量不含有值。
//可以通过将变量的值设置为 null 来清空变量
var person;
var car="Volvo";
document.write(person + "<br>");
document.write(car + "<br>");
var car=null
document.write(car + "<br>");
​
//用new来申明类型
var carname=new String;
var x=      new Number;
var y=      new Boolean;
var cars=   new Array;
var person= new Object;
​
​

JavaScript 变量均为对象。当您声明一个变量时,就创建了一个新的对象。

引用类型的值是保存在堆内存(Heap)中的对象(Object)

基本类型的变量是存放在栈内存(Stack)里的

可以说 "JavaScript 对象是变量的容器"。

但是,我们通常认为 "JavaScript 对象是键值对的容器"。

键值对通常写法为 name : value (键与值以冒号分割)。

键值对在 JavaScript 对象通常称为 对象属性

## JavaScript 语句标识符

break用于跳出循环。
catch语句块,在 try 语句块执行出错时执行 catch 语句块。
continue跳过循环中的一个迭代。
do ... while执行一个语句块,在条件语句为 true 时继续执行该语句块。
for在条件语句为 true 时,可以将代码块执行指定的次数。
for ... in用于遍历数组或者对象的属性(对数组或者对象的属性进行循环操作)。
function定义一个函数
if ... else用于基于不同的条件来执行不同的动作。
return退出函数
switch用于基于不同的条件来执行不同的动作。
throw抛出(生成)错误 。
try实现错误处理,与 catch 一同使用。
var声明一个变量。
while当条件语句为 true 时,执行语句块。

JS函数

<button onclick="myFunction('Harry Potter','Wizard')">点击这里</button>
<script>
function myFunction(name,job){
    alert("Welcome " + name + ", the " + job);
}
</script>