ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

前端微讲解(五)

2022-04-28 19:33:19  阅读:130  来源: 互联网

标签:console 函数 标签 前端 window 讲解 var log


前端微讲解(五)

运算符

  1. 算数运算符
运算符 描述
+ 加法
- 减法
* 乘法
/ 除法
% 取余
++ 自增,如果为x++先赋值后自增1,如果为++x先自增1后赋值
-- 自减,如果为x--先赋值后自减1,如果为--x先自减1后赋值
  1. 比较运算符
运算符 描述
> 大于
< 小于
>= 大于等于
<= 小于等于
== 弱等于(会自动转换类型)
!= 弱不等于
=== 强等于
!== 强不等于
  1. 逻辑运算符
运算符 描述
&&
||
!

流程控制

1.if判断

# 1.单if分支
	if(条件){
        条件成立执行的分支代码块
    }
# 2.if else分支
	if(条件){
        条件成立执行的分支代码块
    }else{
        条件不成立执行的分支代码块
    }
# 3.if else if else分支
	if(条件1){
        条件1成立执行的代码块
    }else if(条件2){
        条件1不成立条件2成立执行的代码块
    }else{
        条件1、条件2都不成立执行的代码块
    }

2.switch语法

var n1 = 1
switch (n1) {
    case 0:
    console.log('000');
    break;  # 如果不加break会基于当前位置一直往下运行
    case 1:
    console.log('111');
    break;
    case 2:
    console.log('222');
    default:  # 没有对应条件统一执行default子代码
    console.log('333')
}

3.while循环

while (循环条件){
    循环体代码
}

4.for循环

for(初始值;循环条件;每次循环之后的操作){
    循环体代码
}

# 循环打印0-9的数字
for (var q = 0;q < 10;q++){
    console.log(q)
}

三元运算符

res = 判断条件?条件成立输出的值:条件不成立输出的值

函数

# 1.定义函数
	function 函数名(参数){
        函数体代码
        return 返回值
    }
# 2.函数解析
	1.function:定义函数的关键字
	2.函数的命名参考变量,js推荐使用驼峰体
    3.参数可写可不写
    4.return:返回值
    5.调用方式:函数名加括号调用
# 3.无参函数
	function 函数名(){
        函数体代码
        return 返回值
    }
# 4.有参函数
	function 函数名(参数1,参数2){
        函数体代码
        return 返回值
    }
调用有参函数的时候,不传参也可以调用,相当于传了两个undefined,也可以少传参数,其余的用undefined补上,也可以多传参数,
但是只会使用相应的参数
# 5.arguments关键字
	用于接收所有的参数
    function f1(){
    console.log(arguments)
    if (arguments.length === 0){
        console.log('什么参数都没传')
    }else if(arguments.length === 1){
      console.log('传了一个参数')
    }else{
      console.log('传了多个参数')
    }
}
# 6.返回值参数
	return不支持返回多个数据
# 7.匿名函数
	var f3 = function (){return 222}
# 8.箭头函数
	var f = v => p;  #等同于v是形参,p是返回值 
    等同于:var f = function (v){
        return p
    }

自定义对象

# 自定义对象
	js中的自定义对象相当于python里面的字典,并且js的自定义对象还可以加点取值。
    自定义一个对象:var d1 = {'name':'jason','age':18},取值d1.name,也可以添加值d1.sex = meal,也支持for循环取值。
	自定义对象还有一个标准格式:var d2 = new Object(),相当于生成了一个空对象

内置对象

1.Date对象

var q1 = new Date()
q1.toLocaleDateString()  # '2022/4/28',打印年月日
q1.toLocaleString()  # '2022/4/28 17:16:01',打印年月日,时分秒
q1.toLocaleTimeString()  # '17:16:01',打印时分秒
方法 作用
getDate
getYear
getDay 星期
getMonth 月(0-11)
getFullYear 完整年
getHours 小时
getMinutes 分钟
getSeconds
getMilliseconds 毫秒
getTime 时间戳

JSON对象

# 1.序列化
	JSON.stringify()
# 2.反序列化
	JSON.parse()

正则对象

# 1.创建正则表达式的两种方式
    var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
    var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/;  # 推荐使用,简洁
# 2.全局匹配
	在正则表达式的最后添加一个字母g,执行全局匹配,查找所有匹配结果,并不是在查找到第一个匹配之后就结束
    var reg3 = /^[a-zA-Z][a-zA-Z0-9]{5,9}$/g;
# 3.正则表达式方法
	test()方法就是一个正则表达式的方法,用于检测一个字符串是否匹配某个模式,如果匹配就返回true,否则就返回false

BOM操作

	BOM全称Browser Object Model,是指浏览器对象模型,他使js有能力与浏览器进行'对话'
# 1.打开子页面(父子联动)
	window.open('https://www.baidu.com','','width=400,height=400')
# 2.关闭页面
	window.close()
# 3.window方法
	window.navigator.appVersion  # 返回web浏览器厂商和版本的详细字符串
    window.navigator.userAgent  # 返回客户端绝大部分信息
    window.history.forward()  # 前进一页
    window.history.back()  # 后退一页
    window.location.href  # 获取页面的url地址
	window.location.reload()  # 刷新页面
	window.location.href = url  # 跳转到指定页面
'''window可以省略不写'''

1.弹框操作

# 1.警告框
	alert()
# 2.用户选择框
	confirm()  # 用户点击确认返回true,点击取消返回flase
# 3.获取用户信息框
	prompt()  # 获取用户输入的内容,也可以通过第二个参数来设置默认的内容

2.计时器

# 1.单次定时
	setTimeout()
# 2.取消定时器
	clearTimeout()
# 3.循环定时
	setInterval()

DOM操作

	DOM全称Document Object Model,是指文档对象模型,通过它可以操作HTML文档的所有元素
# 1.通过标签名查找标签
document.getElementsByTagName('div')  # 返回数组套标签对象
# 2.通过class值查找标签
document.getElementsByClassName('c1')  # 返回数组套标签对象
# 3.通过id值查找标签
document.getElementById('d1')  # 返回标签对象本身

间接查找

方法 用法
parentElement 父节点标签元素
children 所有子标签
firstElementChild 第一个子标签元素
lastElementChild 最后一个子标签元素
nextElementSibling 下一个兄弟标签元素
previousElementSibling 上一个兄弟标签元素

这里是IT小白陆禄绯,欢迎各位大佬的指点!!!

标签:console,函数,标签,前端,window,讲解,var,log
来源: https://www.cnblogs.com/pyqsy/p/16204172.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有