Correcting teacher:天蓬老师
Correction status:qualified
Teacher's comments:
行内脚本
在标签内的事件属性值内写的js代码
<button onclick="alert('这是个按钮')">btn</button>
内部脚本
在页面内script标签内编写的js代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<button onclick="">btn</button>
<script>
document.querySelector('button').addEventListener('click', function () {
alert('Hello PHP!')
})
</script>
</body>
</html>
通过script标签属性src引用的js文件
demo1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<button onclick="">btn</button>
<script src="btn.js"></script>
</body>
</html>
btn.js
document.querySelector('button').addEventListener('click', function () {
alert('Hello World!')
})
使用
var
或let
声明变量。变量命名使用英文、数字、_、$字符,不能使用数字开头。不可以使用保留单词。通常使用小驼峰命名法。
var声明的是全局,let声明的是块级.
var id = 1;
let name = 'php';
使用
const
声明常量。常量命名使用的英文为大写字母,多个 单词之前使用下划线,因常量不可变,声明时就需要赋值。
const USER_NAME = 'PHP中文网';
一个函数是 JavaScript 过程 — 一组执行任务或计算值的语句。
一个函数定义(也称为函数声明,或函数语句)由一系列的function关键字组成,依次为:
函数的名称。
函数参数列表,包围在括号中并由逗号分隔。
定义函数的 JavaScript 语句,用大括号{}括起来。
- 函数
function sum(a,b) {
return a+b;
}
- 匿名函数
没有函数名的函数。
let sum = function (a,b) {
return a + b;
}
- 高阶函数
把函数做为参数的函数
function sum(a,b) {
return a+b;
}
function math(func,arr) {
return func(arr[0],arr[1]);
}
console.log(math(sum,[1,2]));
定义函数时,参数如果没有默认值,调用里需要传值,否则会出错误。
function sum(a,b) {
return a+b;
}
console.log(sum(1));
定义了默认值
function sum(a,b=10) {
return a+b;
}
console.log(sum(1));
当参数不定时,我们使用归并参数
...
来定义,会把多个参数合并为一个数组.
function sum (...arr) {
return arr.reduce((a,b)=>a+b);
}
console.log(sum(1,2,3,4,5));
省略function使用胖箭头
=>
定义的函数。
语法(参数)=>{函数体}
如果函数体只有一句,{}可省略。箭头函数可使用于可使用匿名函数的场景。如回调、函数表达式、函数返回等。。。
如果函数中要使用到this,就不要用箭头函数,不能当构造函数用
function sum (...arr) {
return arr.reduce((a,b)=>a+b);
}
英文简称IIFE 语法:(匿名函数体)(参数)
主要包含两部分。第一部分是包围在 圆括号运算符 () 里的一个匿名函数,这个匿名函数拥有独立的词法作用域。这不仅避免了外界访问此 IIFE 中的变量,而且又不会污染全局作用域。
第二部分再一次使用 () 创建了一个立即执行函数表达式,JavaScript 引擎到此将直接执行函数。
((name)=> console.log('name:%s',name))('zhu')