JavaScript进阶

最新推荐文章于 2024-01-29 17:12:20 发布

这脑子我不想要了(ಥ_ಥ)

最新推荐文章于 2024-01-29 17:12:20 发布

阅读量1k

点赞数 12

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/weixin_64938628/article/details/123170622

版权

一.自定义函数

有关返回值

1.JS中函数一定有返回值,没有返回时返回未定义nuderfined

2.JS中函数的返回值可以是任意类型

3.不需要指定返回类型

关于return的作用

1.用于给函数设置返回值

2.可以中断函数的运行

关于参数

1.可以带参数，不需要指定参数类型

2.参数可以任意传，没有参数默认为nuderfined

3.调用函数时不会对参数个数进行判断

二.函数类型

匿名函数

function (){

}

顾名思义，没有名称，它的调用方法是将匿名函数当做一个整体写进括号里

(function (){
})();

普通函数

function b(z){//参数可以不写
			console.log("Hello")
			if(z){//当条件为真
				return 'yes'
			}
			return 'no'
		}
		//调用函数
		console.log(b())

高阶函数

可以将函数作为参数

function f1(a,b){
 return a(b)
}

箭头函数

//箭头函数
var a=()=>{
	document.write("调用了")//在页面显示
}

在这里我们可以利用函数完成计算机功能

我使用的是这个编译器，然后把代码复制过来的，这些是编译器自带的

<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
    //如果你也使用的是这个编译器写JS请先写<script></script>
    //然后在<script>中间写代码</script>
	</body>
</html>

<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
        //<input type="" id="">输入框
		<p>第一个值:<input type="text" id="a1"></p>
		<p>第二个值:<input type="text" id="a2"></p>
        //结果不能被更改所以设置禁用
        //disabled 禁用
		<p>结果:<input type="text" id="a3" disabled></p>
		<p>
            //设置加减乘除的按钮
            //onclick 当它被点击时
			<button onclick="b1()">+</button>
			<button onclick="b2()">-</button>
			<button onclick="b3()">*</button>
			<button onclick="b4()">/</button>
		</p>
		<script>
		function b1(){
			var a=a1.value;//得到输入框的值
			var b=a2.value;
			var c=parseInt(a)+parseInt(b)//输入框输入的是字符，所有要转换为数字
			if(isNaN(c)){//判断是否是非数字
				a3.value="输入错误"
				return
			}
			a3.value=c
		}
		function b2(){
			var a=a1.value;
			var b=a2.value;
			var c=parseInt(a)-parseInt(b)
			if(isNaN(c)){
				a3.value="输入错误"
				return
			}
			a3.value=c
		}
		function b3(){
			var a=a1.value;
			var b=a2.value;
			var c=parseInt(a)*parseInt(b)
			if(isNaN(c)){
				a3.value="输入错误"
				return
			}
			a3.value=c
		}
		function b4(){
			var a=a1.value;
			var b=a2.value;
			var c=parseInt(a)/parseInt(b)
			if(isNaN(c)){
				a3.value="输入错误"
				return
			}
			a3.value=c
		}
		</script>
	</body>
</html>

三.window对象

scree:有关客户端的屏幕和显示性能的信息

location：有关当前URL的信息

1.location.href:跳转页面

<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<button onclick="a()">点我</button>//先设置一个按钮
		<script>
		//window对象是JS中最大的对象

		function a(){
			//跳转页面
            //添加链接
			location.href="https://www.baidu.com"
		}	
		</script>
	</body>
</html>

2.location.reload:刷新当前页面

history：浏览历史

function back(){
		//返回
		history.back()
	}
		
function forward(){
		//前进
		history.forward()
	}

四.wiodow对象常用函数

     //定时器
      //定义时间，单位是毫秒 ，3秒后显示
		setTimeout(function(){
			alert("嘿嘿")
		},3000)
		
		//循环定时器
		var a1=0;//定义循环的次数
		var i=setInterval(function(){
			a1++
			console.log("哈哈")
			if(a1==10){//循环10后清除
				clearInterval(i)
			}
		},1000)

关于弹窗在我已发布JavaSc.基本语法中有写，想了解的可以去看看。新开和关闭不常用就没写，想了解的可以去搜索一下。

五.内置对象

修改元素的方法

<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<h3 id="m"></h3>
		<script>
       setInterval(()=>{
			//textContent不识别html语句
			m.textContent=new Date()
		},1000)
		
		setInterval(()=>{
          //innerHTML可以识别html语句 
			 h3.innerHTML="<kbd>"+new Date().toLocaleTimeString()+"</kbd>"
		},1000)

		</script>
	</body>
</html>

Date是时间，这个我就不细讲了

Math

我只列举了几个常见的，想要了解其他的就请大家自己去搜索吧

Math.max()	最大值
Math.min()	最小值
Math.ceil()	向上取整
Math.floor()	向下取整
Math.round()	四舍五入

console.log(Math.max(1,2,3,4,5,6,7))
console.log(Math.min(1,2,3,4,5,6,7))
console.log(Math.ceil(1.99))
console.log(Math.floor(1.99))
console.log(Math.round(1.33))
//在控制台打印

打印结果