JavaScript01

最新推荐文章于 2024-07-19 18:10:50 发布

大模型研究僧

最新推荐文章于 2024-07-19 18:10:50 发布

阅读量111

点赞数

分类专栏： JavaWeb 文章标签： javascript 字符串 java js html

本文链接：https://blog.csdn.net/weixin_44006686/article/details/116033539

版权

JavaWeb 专栏收录该内容

7 篇文章 1 订阅

订阅专栏

文章目录

JavaScript是什么,有什么用?

JavaScript是运行在浏览器上的脚本语言,简称JS.

JavaScript的目标程序以普通文本形式保存,这种语言都叫做脚本语言.
Javaserver Pages(隶属于java语言的,运行在JVM当中)

JS:JavaScript(运行在浏览器上
JS是一门事件驱动型的编程语言,依靠事件去驱动,然后执行对应的程序.在JS中会很多事件,其中有一个事件叫做:鼠标单击,单词:click.并且任何事件都会对应一个事件句柄叫做:onclick
使用JS代码弹出消息框:

在JS中有一个内置的对象叫做window,用法是window.alert(“消息”)

window可以省略不写
JS中的字符串可以使用双引号,也可以使用单引号

HTML中引入JS语句的三种方式

在标签中加入句柄
脚本块

CSS是放在了head标签的后面
```
<body>
   <script type="text/text/javascript">
		window.alert("hello world");
	</script>
</body>
```
暴露在脚本块当中的程序,在界面打开的时候执行,并且遵循自上而下的顺序依次逐行执行(这个代码执行不需要事件)

JavaScript脚本块可以再一个界面中出现多次,没有要求

JavaScript的脚本块出现的位置也没有要求,随意

js代码的注释和java一样

alert有阻塞当前界面加载的作用,直到你点击确定
引入外部独立的js文件
```
//在需要的位置引入js脚本文件
<script type = "text/javascript" src= "js/1.js"></script>
```
引入外部独立的js代码的时候,js代码会遵循自上而下的方式逐行执行

引入js文件时候的脚本块,里面的代码不会运行

JS中的变量

关于js中的变量

首先回顾java中的变量类型

java中的变量

byte-short-int-long-float-double-boolean-char

1 2 4 8 4 8 2 1

java中要求变量声明的时候是什么类型,以后永远都是这个类型,不可变.编译器强行固定变量的数据类型,称为强类型语言

JavaScript中的变量

怎么声明变量?

var 变量名;

怎么给变量赋值/

变量名 = 值;

JavaScript是一种弱类型语言,没有编译阶段,一个变量可以随意赋值什么类型的值都可以

重点:JavaScript是一种弱类型语言

在JS当中**,当一个变量没有手动赋值的时候,系统默认赋值undefined**

变量也是必须要先声明在使用,不声明直接使用会报错

全局变量

在函数之外声明的变量属于全局变量,全局变量的生命周期是浏览器打开时声明,浏览器关闭时销毁,尽量少用.因为全局变量一直在浏览器当中的内存中,耗费内存空间,能使用局部变量尽量使用局部变量

当一个变量在声明的时候没有使用var关键字,无论在哪里声明都是全局变量

局部变量

在函数体当中声明的变量,包括一个函数的形参都属于局部变量,局部变量的生命周期是:函数开始执行时局部变量的内存空间开辟,局部变量生命周期较短.

JS中的函数

js中的函数:等同于java语言的方法,函数也是一段可以被重复利用的代码片段
函数一般都是可以去完成某个特殊功能的
回顾java中的方法

[修饰符列表] 返回值类型函数名(形式参数列表){
方法体;
}
js中的函数格式;
- 第一种:
  
  function 函数名(形式参数列表){
  
  函数体;
  
  }
  
  js中的函数不需要指定返回值类型,返回什么类型都行
- 第二种:
  
  函数名 = function(形式参数列表){
  
  函数体;
  
  }

在JS当中,函数的名字不能重名,如果两个函数重名了,后面的函数会将前面的函数覆盖掉

JS的数据类型

虽然JS中的变量在声明的时候不需要执行数据类型,但是在赋值,每一个数据还是有类型的,所以我们也需要学习一下JS包括哪些数据类型
分为原始类型和引用类型

原始类型:Undefined,Number,String,Boolean,Null

引用类型:Object以及Object的子类
ES规范,在ES6之后,又基于以上6种类型之外添加了一种新的类型:Sysbol
JS中有一个运算符叫做typeof,这个运算符可以在程序的运行阶段动态的获取变量的数据类型

typeof运算符的语法格式;

typeof 变量名

typeof运算符的运算结果是一下留个字符串之一:注意字符串都是小写

undefined

number

string

boolean

object

function
在JS当中比较字符串是否相等使用"=="完成,没有equals

比如

function sum(a,b){
    if(typeof a =="number" &&typeof b == "number"){
        return a+b;	
    }
    alert(a+","+b+"必须都为数字");
}

undefined类型

Undefined类型只有一个值,这个值就是undefined,当一个变量没有手动赋值
系统默认赋值undefined,或者也可以给变量手动赋值undefined

number类型

number类型包括那些值?

整数小数正数负数,不是数字,无穷大都属于number类型
关于NaN(不是数字)

表示not a number,不是一个数字,但属于Number类型

什么情况下结果是一个NaN呢?运算结果本来应该是一个数字,最后算完不是一个数字的时候,结果是NaN.
当除数为0的时候,结果为无穷大Infinity(无穷大)

number的几个常用函数

isNaN()函数

用法:isNan(数据),结果是true表示不是一个数字,结果是false表示是一个数字
parseInt()函数

可以将字符串自动转换成数字,并且取整数位(3.99->3)

parseInt(“3.999”)
parseFloat():可以将字符串自动转化成数字

parseFolat(“3.14”+1);
Math.ceil()函数(Math是一个类)

向上取整

Math.ceil(“2.1”);

boolean类型

JS中的布尔类型永远都只有两个值:true和false
在boolean类型中有一个函数叫做:Boolean()

语法格式:

Boolean()函数的作用是将非布尔类型转换成布尔类型

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-mbXAxfjG-1619099146782)(C:\Users\14505\AppData\Roaming\Typora\typora-user-images\image-20210421153731816.png)]$

规律:有就转换成true,没有就转换成false

String类型

在JS当中字符串可以使用单引号,也可以使用双引号

var s1 = “test”;
在JS当中,怎么创建字符串对象?

两种方式:
- var s =“abc”;
- 使用JS的内置的支持类String:var s2 = new String(“abc”);
需要注意的是String是一个内置的类,可以直接用,String的父类是Object.

无论是String还是string,他们的属性和函数都是通用的.
常用函数:

indexOf:获取指定字符串在当前字符串中第一次出现的索引

lastIndexOf:获取指定字符串在当前字符串中最后一次出现的索引

replace:替换

substr:截取子字符串

subString:截取子字符串

toLowerCase:转换消息

toUpperCase:转换大写

split:拆分字符串
演示:

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-ForcXmzf-1619099146784)(C:\Users\14505\AppData\Roaming\Typora\typora-user-images\image-20210421163033734.png)]$
考点:substr和substring的区别

substr是(startIndex,length);
substring(startIndex,endIndex) 注意:不包含endIndex

Object类型

object类型是所有类型的超类,自定义的任何类型,默认继承object
Object类包括哪些属性?

prototype属性(常用的,主要是这个):作用是给类动态的拓展属性和函数

constructor属性
Object类包括哪些函数?

toString()

valueOf()

toLocaleString()
在JS中定义的类默认继承Object,汇集成Object类中所有的属性以及函数,换句话说,自己定义的类中也有prototype属性.
在JS中怎么定义类?怎么new对象?

定义类的语法;
- 第一种方式:
  
  function 类名(形参){
  
  }
- 第二种方式:
  
  类名 = function(形参){
  
  }
创建对象的语法:

new 构造方法名(实参); //构造方法和类名一致

意思就是可以吧他当做函数来看,也可以把它当做一个类来看(创建对象)

JS中类的定义,同时又是一个构造函数的定义

JS中类的定义和构造函数的定义是放在一起来完成的

定义一个:

product = function(pno,pname,price){
    this.pno = pno;
    this.pname = pname;
    this.getPrice = function(){
        return this.price;
    }
}

java和JS的区别

在这里插入图片描述

null,undefined,NaN之间的区别

null,NaN,undefined数据类型不一致

在这里插入图片描述

在JS当中有两个比较特殊的运算符

==(等同运算符:只判断值是否相等)

===(全等运算符:既判断值是否相等,又判断数据类型是否相等)

JS中的常用事件:

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-sHZ9n6J3-1619099146794)(C:\Users\14505\AppData\Roaming\Typora\typora-user-images\image-20210422102401632.png)]

任何一个事件都会对应一个事件句柄,事件句柄是在事件钱添加on

onxxx这个事件句柄出现在一个标签的属性位置上,(事件句柄以属性的方式存在)

注册事件的方式:

第一种:<.input type =“button” value = “hello” onclick = “sayhello()(这是个函数)”>

sayhello()这个函数我们称为回调函数
第二种:通过JS代码来完成事件的注册

<.input type = “button” value = “hello2” id = “mybtn”>

function doSome(){

alert(“do some”);

}
- 第一步:先获取这个按钮对象(document是全部小写,内置对象,可以直接用,document就代表整个HTML界面)
  
  var btnObj = document.getElementById(“mybtn”);
- 第二步:给按钮onclick属性赋值
  
  btnObj.οnclick=dosome; // 注意:千万别加小括号
  
  同样也可以使用匿名函数
```
<input type = "button" value = "hello2" id = "mybtn">
    function doSome(){

     alert("do some");
}
btnObj.onclick=dosome;
或者:btnObj.onclick = function(){
    alert("test......"); 
}
```