Java Script 语法总结

最新推荐文章于 2024-05-28 10:57:03 发布

Zincy星辰

最新推荐文章于 2024-05-28 10:57:03 发布

阅读量1.3k

点赞数 3

分类专栏：前端技术指北文章标签： javascript html css 前端大前端

本文链接：https://blog.csdn.net/qq_52057693/article/details/124139618

版权

前端技术指北专栏收录该内容

16 篇文章 1 订阅

订阅专栏

1. 引入方式

内嵌式。在 <script> 标签

<body>
    <script>
        alert("hello");
    </script>
</body>

行内式。在 HTML 标签的一些属性里直接写 JS 代码

<input type="button" value="按钮" onclick="alert('hello')">

外部式。把 JS 写到单独的文件里，使用 script 标签引入

<script src="xxx.js"></script>

2. 基本语法

注释

//行注释
/* 块注释 */

输入输出

// 弹出一个输入框
prompt("请输入您的姓名：");

// 弹出一个警示对话框
alert("hello");

// ※ 向控制台打印日志 ※
console.log("这是一条日志");

变量 `let`

// var 变量不需要声明类型
var name = '张三';
var age = 20;

// let 变量
let name = '张三';

不区分int和float，都叫做number类型（数字）

动态类型

let a = 10;
console.log(a);
console.log(typeof a);
a = 'hello';
console.log(a);
console.log(typeof a);

基本数据类型

number 数字（不区分整数和小数）
boolean 布尔（true真1，false假0）
string 字符串
undefined 表示未定义
null 表示空值

运算符

==（隐式类型转换判断是否相等）
===（不触发隐式类型转换判断是否相等）
!==（不触发隐式类型转换判断是否不等）

a && b 表示如果a的值为真(非0)，表达式的值就是 b 的值；反之为 a 的值

a || b 表示如果a的值为真，表达式的值就是 a 的值，反之为 b 的值

x = x || 0; 这种写法是说，万一x是null或undefined，就将其设为 0 ，如果是其他值就不变

3. 数组

键值对的数组（类似哈希表）

创建数组

// let arr = new Array();	//很少用
let arr = [1, 2, 'hello', false, null];

获取下标、长度

console.log(arr[0]);	// 1
console.log(arr[2]);	// hello
console.log(arr[3]);	// false
console.log(arr[4]);	// null
console.log(arr[10]);	// undefined	越界位置值为 undefined
console.log(arr.length);	// 5

arr[100] = 100;
console.log(arr.length);	// 101
arr[-1] = 200;
arr['hello'] = 300;
arr.world = 500;
console.log(arr.length);	// 101  数组大小不变，但值存在 --> 就像键值对结构的数组

新增数组元素 `push`

通过修改 length 新增
通过下标新增
使用 push 追加元素到数组末尾🏹

let arr = [];
arr.push(1);
arr.push(2);
arr.push(3);

删除元素 `splice`

arr.splice(2, 1);	//表示从下标为 2 的位置开始删，删 1 个元素

遍历

int arr = ['aaa', 'bbb', 'ccc'];
// 1. for 循环遍历
for (let i = 0; i < arr.length; i++) {
    console.log(arr[i]);
}

// 2. for in 遍历
for (let i in arr) {
    console.log(arr[i]);
}

// 3. for of 遍历
for (let value of arr) {
    console.log(value);
}

4. 函数（function、method、produce）

如果刻意区分：

函数指的是独立的函数
方法指的是一个和类绑定的“成员函数
过程指的是一个没有返回值（void）的函数

语法格式

// 创建函数/函数声明/函数定义
function 函数名(形参列表) {
    // 函数体
    return 返回值;
}

// 特点：
// 1. 没有返回类型，只有一个function关键字
// 2. 形参列表只有形参名字，没有参数类型
// 3. 不要求实参和形参个数相同

作用域

使用 let 创建的变量的作用域是 { } 块级作用域

使用 var 定义的变量没有 “ 块级作用域 ”，只有函数级作用域

5. 对象

JS 的对象是单独存在的，不依赖类
对象和对象之间，类型都是 Object

let student = {
	name: '张三',
	age: 20
}
console.log(student.name);
console.log(student['name']);

key 就是属性名，value就是属性值
键值对之间使用 , 分割，最后一个键值对后面的逗号可有可无
键和值之间使用 : 分割

构造函数

function Cat(name, type) {
    this.name = name;
    this.type = type;
    this.miao = function() {
        console.log('喵');
    }
}

let cat1 = new Cat('小墨','中华田园猫');
console.log(cat1);
let cat2 = new Cat('刺球','英国长毛猫');
console.log(cat2);

Zincy星辰

关注

3
点赞
踩
5

收藏

觉得还不错? 一键收藏
2
评论
Java Script 语法总结

1. 引入方式内嵌式。在 <script> 标签<body> <script> alert("hello"); </script></body>行内式。在 HTML 标签的一些属性里直接写 JS 代码<input type="button" value="按钮" onclick="alert('hello')">外部式。把 JS 写到单独的文件里，使用 script 标签引
复制链接

扫一扫