首页 > 编程语言 >JavaScript on html

JavaScript on html

时间:2024-11-11 20:09:45浏览次数:1  
标签:function 函数 JavaScript alert html var JS 变量

我咋没发啊,丢草稿箱里给忘了,发一下

好像早就写了

首先你要会一点 html

一点都不会建议学了再来

Vscode 自带 html+JS 自动补全,比较好用

不会运行 JS 建议多动脑子

调用

可以用 <script> 调用

也可以以字符串形式写在超链接的地方

弱类型语言,变量用 var 定义 (=new() 格式下可以不使用 var)

JS 是个灵活性挺高的语言,而且和 C 比较像,分支结构啥的你直接按印象来一般不会错,这里就不提了

UPD: 灵活性真的高,既忘记 var 又忘记分号也能跑起来

1

<script>
    var a=1;
    alert(a);  //输出函数
</script>

这个输出函数会直接以弹窗形式输出

2

<a href="javascript:var a=1;alert(a);">Clicks</a>

这是一个直接以超链接形式执行的例子

也是网页中常见的调用方式

这里需要注意的是,并不是所有套在字符串里的脚本都需要加 javascript: 前缀,只有 href 里需要,这是一个特例

通常的调用方式大概形如这样

<input onblur="alert('loss focus')">

基本数据类型

Boolean(布尔)、Number(数字)、String(字符串)、Undefined(未定义)、Null(空对象)、Object(对象类型,相当于 class)

声明特定类型的参数可以采用形如 var = new type 一类的声明

<script>
    a=new Boolean();
    alert(typeof(a)); //Object,因为未赋值
</script>

Undefined 变量只有一个值,为 undefined

同理,Null 变量也只有一个值,为 null

以下情况会导致出现 Undefined

  • var 声明变量时未赋值
  • 将无返回值函数赋值给变量

数据类型转换直接调用对应的类型名函数就行了

额外的,eval 可以将字符串转成 JS 代码执行

<script>
    var a="var a=1,b;if(a){alert('a可用');}if(b){alert('b可用');}";
    eval(a);
</script>

函数

直接用 function 定义

<script>
    function fibbonacci(x){
        if(x==1){
            return 1;
        }
        else if(x==2){
            return 1;
        }
        else{
            return fibbonacci(x-1)+fibbonacci(x-2);
        }
    }
    alert(fibbonacci(7));
</script>

运算符

判等

首先是判等的问题

因为 JS 灵活性太高了,所以很多类型可以直接强转比较

因此出现了相等与全相等,前者只要求强转后值相等,后者要求类型也一样

<script>
    var a=1,b='1'
    alert(a==b);  //true
    alert(a===b); //false
</script>

逻辑

JS 里 &&|| 全都是短路运算符

如果不想短路可以用位与,位或

变量可用性

如果一个变量不是 未定义,null,undefined 中的一种,则其可用

JS 提供了一种判断变量是否可用的办法,就是直接套在 if 里

<script>
    var a=1,b
    if(a){alert('a可用');}
    if(b){alert('b可用');}
</script>

JS 中任何地方声明的变量在全局均可用

方法

函数中提供了一个 arguments 数组,是一个打包好的传入参数的集合

可以解决不定参的问题

<script>
    function sum(){
        var ans=0;
        for(var i=0;i<arguments.length;++i){
            ans+=arguments[i];
        }
        return ans;
    }
    alert(sum(1,2,3,4,5));
</script>

咋这么像 C 语言(再次感叹)

JS 的函数是面向对象形式的,这意味着可以将函数赋值给变量

但不支持直接传入函数内

匿名函数是支持的

将函数用小括号套住,后面可以直接传参运行

<script>
    t=function(a){return a+1;};
    alert(t(1));
    alert((function(a){return a+1;})(1));
</script>

JS 的函数不传址,以下函数无法实现修改原变量功能

<script>
    t=function(a){a+=1;};
    var a=1;
    t(a);
    alert(a);
</script>

闭包

JS 中可以使用闭包来模拟面向对象

闭包的实质是一种作用域链,在一个函数内部又定义了一个函数,内部函数函数能访问外部函数作用域范围内的变量,这时这个内部函数就叫做闭包。无论这个内部函数在哪里被调用都能访问的到外部函数作用域中的那些变量

其实这就比较像一个 class 了,考虑将外部函数看成 class,内部函数看成 class 内的方法,class 内的方法能调用到 class 内的变量,这就和面向对象基本一致了

<script>
    function Class(){
        return function print(x){
            alert(x);
        }
    }
    var x=Class();
    x('CTH');
</script>

这是模拟了面向对象中的直接为变量赋值函数的方法

模拟 class 可以在 function 中直接创建方法

<script>
    function Class(){
        var name='none'
        this.nameis=function(x){
            name=x;
        }
        this.printname=function(){
            alert(name);
        }
    }
    var a=new Class();
    a.nameis('CTH');
    a.printname();
</script>

JS 的 Object 也可以实现类似 class 的效果

缺啥加啥就行了

<script>
    var a=new Object();
    a.name='CTHoi'
    a.print=function(){alert(a.name);}
    
    a.print();
</script>

Object 还提供了一种访问对象的方式,就是用中括号+String

<script>
    var a=new Object();
    a.name='CTHoi'
    a.print=function(){alert(a.name);}

    alert(a['name']);
</script>

标签:function,函数,JavaScript,alert,html,var,JS,变量
From: https://www.cnblogs.com/HaneDaCafe/p/18534393

相关文章

  • 【Azure Developer】在使用Azure Bot Service JavaScript的实例代码遇见Cannot find m
    问题描述从Github中下载了JavaScript的BotServiceEchoBot实例代码,本地执行,总是报错Cannotfindmodule'node:crypto' 错误信息Error:Cannotfindmodule'node:crypto'Requirestack:atFunction.Module._resolveFilename(internal/modules/cjs/loader.js:902:15)......
  • 前端技术对html中块级元素的学习
    块级元素目录块级元素列表元素有序列表无序列表自定义列表列表元素有序列表在HTML中,标签用来表示有序列表。有序列表之间的内容有先后顺序之分,例如菜谱中的一系列步骤,这些步骤需要按顺序完成,这时就可以使用有序列表。我们来看一个简单的实例:<!DOCTYPEhtml><htmllang......
  • 【原创】基于 face-api.js 的HTML,PHP人脸识别系统实现
    声明:本程序仅仅只是实现了PHP、HTML页面拉取手机/电脑摄像头,进行实时拍照获取人脸,可根据你的开发需求进行进一步的实现所需功能。使用截图电脑我没装摄像头,所以就是能调取提示,其他不演示了手机端如图技术栈前端:HTML5,JavaScript人脸识别:face-api.js视频流处......
  • HTML实现二级导航的制作
    源文件在上面。。。一级导航:    首先想要做二级导航那必然是要先做完一级导航。一级导航非常简单,简单分析一下:首先导航是可以点击的所以本身是个a标签其次导航是多个的所以通常将a标签套在一个列表下的li标签里。<divclass="box"><ul><li><imgsrc......
  • Excel.Application使用手册(摘自:https://www.cnblogs.com/codingking/p/6484461.html)
    定制模块行为(1)OptionExplicit'强制对模块内所有变量进行声明  OptionPrivateModule'标记模块为私有,仅对同一工程中其它模块有用,在宏对话框中不显示  OptionCompareText'字符串不区分大小写  OptionBase1'指定数组的第一个下标为1(2)OnErrorResumeNe......
  • JavaScript基础总结
             JavaScript(简称JS)是一个广泛使用的客户端脚本语言,常用于网页开发中。它可以在浏览器中运行,执行交互操作和动态效果。以下是JavaScript基础的所有核心知识点,按主题分类列出。1.基本语法声明变量使用var、let和const来声明变量:varname='Alice';/......
  • JavaScript题目一 根据成绩给出学生考评
            根据学生的成绩给出考评,可以通过if或switch语句来实现。下面是一个简单的JavaScript代码示例,根据学生的成绩返回不同的评语。示例代码:functionevaluateStudent(score){letevaluation;if(score>=90){evaluation='优秀';}else......
  • JavaScript题目二 实现猜数字游戏
    实现一个猜数字游戏的过程,通常包括以下几个步骤:生成一个随机数:计算机随机生成一个目标数字。用户输入猜测:玩家猜测数字并提交。比较用户输入与目标数字:计算机检查玩家的猜测,给出提示(比如“猜小了”或“猜大了”)。循环进行:直到玩家猜对为止,或者达到预设的次数。1.HTML文件(......
  • JavaScript题目三 制作简易计算器
    目标:提供四个基本的运算功能:加、减、乘、除。支持数字输入和运算符输入。显示结果。1.HTML文件(index.html)<!DOCTYPEhtml><htmllang="zh-CN"><head><metacharset="UTF-8"><metaname="viewport"content="width=device-width,i......
  • JavaScript变量
    变量是用于存储信息的"容器"。实例varx=5;vary=6;varz=x+y;尝试一下»就像代数那样x=5y=6z=x+y在代数中,我们使用字母(比如x)来保存值(比如5)。通过上面的表达式z=x+y,我们能够计算出z的值为11。在JavaScript中,这些字母被称为变量。您可以把变量看做存储数......