Javascript

  • 编程语言

  • 浏览器就是Javascript语言的解释器

  • javascript使HTML页面具有更强的动态和交互性，用于控制网页的行为（HTML、CSS实现静态画面）

  • 代码位于head或者body末尾

  • 开发环境：chrome+f12+sources+snippets

  • ES6:

1javascript语法

  • 对大小写敏感
  • 面向对象的语言

1.1标识符&关键字

  • 标识符命名规则：
    • 开头：字母/_/$
    • 组成：字母/_/$/数字

1.2变量&常量

  • 变量(需要声明+赋值，可分开)动态数据类型，可改变
# 全局变量声明
var poetryName = "###"
# 局部变量的声明
let poetryName = '###'
  • 常量
const/var poetryName = "###"

1.3数据类型

image-20221102120956185

  • 数据类型的转换：

//转换为字符串
String()
//转换为数字
Number()

1.4操作符

  • 算数、赋值、比较、字符串、条件、逻辑、位运算符

1.5注释

//单行注释
/*多行注释
*/

1.6函数&闭包

  • 函数：
//函数
function functionname()
{
	//语句
}
  • 闭包：定义在函数内部的函数，闭包可以访问父函数的局部变量，但是不能修改，父函数返回一个函数。

1.6.1常用内置函数

  • 输出方式：
console.log("helloworld")

alert("helloworld")

1.7控制语句

  • 程序设计中，控制语句有三种：条件，循环和跳转；程序设计中，流程有三种：顺序、循环、分支

  • 条件：

    • if...else
    • switch...case...default
    switch(toDay){
	case one:
		content
	break;
	case two:
		content
	break;
	default:
		console.log('something wrong')
}

  • 循环：

    • while
    • do...while...：至少执行一次
    • for：同C
    • for...in...：遍历

  • 跳转语句：

    • break：跳出循环
    • continue：结束本次循环
    • return：函数返回

1.8程序异常

  • 捕获与抛出：程序不会中断

    • try...catch
    try{
	console.log(num);
	num++;
}catch(e){
console.log(e)
}
//referenceerror：num is not defined

1.9类（面向对象）

  • 定义：
class ClassName{
	//用于创建和初始化类
	constructor()
}
  • 继承：extends
class Dog extends Animal{
	//
}
  • 静态方法：static
//在js中，静态方法不能在对象上调用，只能在类中调用
class Runoob{
	static hello(){
	return 'hello!'
	}
}
  • 类的调用
class A{
    static hello(){
        alert('helloworld')
    }
}

a = new A()
a.hello()

2DOM和BOM

  • 内置模块
  • DOM对页面上的HTML标签进行操作
  • BOM对浏览器进行操作
  • 这两个模块可以实现所有效果，但是比较麻烦

3jQuery是第三方模块

  • 第三方模块
  • 引用后直接用，代码量少