博主信息
博文 34
粉丝 0
评论 0
访问量 24946
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
0331作业
千山暮雪
原创
635人浏览过

1. JS的引入方式

  • 行内脚本

    在标签内的事件属性值内写的js代码

    1. <button onclick="alert('这是个按钮')">btn</button>
  • 内部脚本

    在页面内script标签内编写的js代码

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4. <meta charset="UTF-8">
    5. <title>Title</title>
    6. </head>
    7. <body>
    8. <button onclick="">btn</button>
    9. <script>
    10. document.querySelector('button').addEventListener('click', function () {
    11. alert('Hello PHP!')
    12. })
    13. </script>
    14. </body>
    15. </html>
  • 外部脚本

    通过script标签属性src引用的js文件
    外部脚本
    demo1.html

    1. <!DOCTYPE html>
    2. <html lang="en">
    3. <head>
    4. <meta charset="UTF-8">
    5. <title>Title</title>
    6. </head>
    7. <body>
    8. <button onclick="">btn</button>
    9. <script src="btn.js"></script>
    10. </body>
    11. </html>

    btn.js

    1. document.querySelector('button').addEventListener('click', function () {
    2. alert('Hello World!')
    3. })

2.变量与常量的声明与使用方式

使用varlet声明变量。变量命名使用英文、数字、_、$字符,不能使用数字开头。不可以使用保留单词。通常使用小驼峰命名法。
var声明的是全局,let声明的是块级.

  1. var id = 1;
  2. let name = 'php';

使用const声明常量。常量命名使用的英文为大写字母,多个 单词之前使用下划线,因常量不可变,声明时就需要赋值。

  1. const USER_NAME = 'PHP中文网';

3. 函数与高阶函数

一个函数是 JavaScript 过程 — 一组执行任务或计算值的语句。
一个函数定义(也称为函数声明,或函数语句)由一系列的function关键字组成,依次为:
函数的名称。
函数参数列表,包围在括号中并由逗号分隔。
定义函数的 JavaScript 语句,用大括号{}括起来。

  • 函数
    1. function sum(a,b) {
    2. return a+b;
    3. }
  • 匿名函数
    没有函数名的函数。
    1. let sum = function (a,b) {
    2. return a + b;
    3. }
  • 高阶函数
    把函数做为参数的函数
  1. function sum(a,b) {
  2. return a+b;
  3. }
  4. function math(func,arr) {
  5. return func(arr[0],arr[1]);
  6. }
  7. console.log(math(sum,[1,2]));

4. 函数的参数,归并参数

定义函数时,参数如果没有默认值,调用里需要传值,否则会出错误。

  1. function sum(a,b) {
  2. return a+b;
  3. }
  4. console.log(sum(1));

定义了默认值

  1. function sum(a,b=10) {
  2. return a+b;
  3. }
  4. console.log(sum(1));

当参数不定时,我们使用归并参数 ...来定义,会把多个参数合并为一个数组.
归并参数

  1. function sum (...arr) {
  2. return arr.reduce((a,b)=>a+b);
  3. }
  4. console.log(sum(1,2,3,4,5));

5. 箭头函数的语法与使用场景

省略function使用胖箭头=>定义的函数。
语法(参数)=>{函数体}
如果函数体只有一句,{}可省略。箭头函数可使用于可使用匿名函数的场景。如回调、函数表达式、函数返回等。。。
如果函数中要使用到this,就不要用箭头函数,不能当构造函数用

  1. function sum (...arr) {
  2. return arr.reduce((a,b)=>a+b);
  3. }

6. 立即执行函数的语法与使用方式

英文简称IIFE 语法:(匿名函数体)(参数)
主要包含两部分。第一部分是包围在 圆括号运算符 () 里的一个匿名函数,这个匿名函数拥有独立的词法作用域。这不仅避免了外界访问此 IIFE 中的变量,而且又不会污染全局作用域。
第二部分再一次使用 () 创建了一个立即执行函数表达式,JavaScript 引擎到此将直接执行函数。
IIFE

  1. ((name)=> console.log('name:%s',name))('zhu')
批改老师:天蓬老师天蓬老师

批改状态:合格

老师批语:
本博文版权归博主所有,转载请注明地址!如有侵权、违法,请联系admin@php.cn举报处理!
全部评论 文明上网理性发言,请遵守新闻评论服务协议
0条评论
作者最新博文
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号

  • 登录PHP中文网,和优秀的人一起学习!
    全站2000+教程免费学