5、前端--js常量、变量、5种基本数据类型(number string boolean undefined object)、运算符、流程控制、三元运算符、函数、自定义对象、内置对象、BOM操作
变量与常量
在JS中声明变量需要使用关键字
老版本 var(全部都是全局变量)
新版本 let(可以声明局部变量)
# 推荐使用let(其实问题不大)
在JS中声明常量也需要使用关键字
const # 声明一个真正意义上的常量
如何创建变量
var name = 'jason'
let name = 'jason01'
如何创建常量
const pi = 3.14
"""
可以编写js代码的地方
1.pycharm提供的js文件
2.直接使用浏览器提供的编程环境
"""
ps:pycharm在使用上述关键字的时候如果出现了报错说明js版本没有选择6
需要我们自定义设置 settings>>>l f>>>js
5种基本数据类型
python基本数据类型
int、float、str、list、dict、bool、tuple、set
js基本数据类型
number、string、boolean、undefined、object()
查看数据类型
python中使用type()
js中使用typeof
1、number类型
# 数值类型:包含了整型与浮点型
parseInt、parseFloat
NaN:Not A Number
"""NaN属于数值类型 表示的意思是 不是一个数字"""
2、string类型
# 定义字符类型的方式
1.单引号
2.双引号
3.反引号
var s1 = `
jason老师
tony老师
kevin老师
`
# 在js中字符串的拼接推荐使用+号
# 格式化输出(模板字符串的功能)
var name1 = 'jason'
var age = 18
`my name is ${name1} my age is ${age} `
3、boolean类型
在python中布尔值类型首字母大写
True False
在js中布尔值类型全部小写
true false
4、null与undefined类型
null表示的意思是空
undefined表示的意识是未定义
eg:null意思是厕纸用完了 undefined意思是厕纸都没装
5、对象之数组类型
# 对应到python中就是列表list
l2.splice(2,1) # 第一个参数是起始位置 第二个参数是删除元素的个数
运算符
1.比较运算符
== 弱等于 # 会自动转换数据类型至相同状态
=== 强等于 # 不会自动转换数据类型
2.逻辑运算符
python中
and or not
js中
&& || !
流程控制
'''if判断'''
python中
if 条件:
条件成立之后执行的代码
else:
条件不成立执行的代码
js中
if(条件){
条件成立之后执行的代码
}else{
条件不成立执行的代码
}
if(条件1){
条件1成立之后执行的代码
}else if(条件2){
条件2成立之后执行的代码
}else{
条件都不成立执行的代码
}
'''switch'''
var day = new Date().getDay();
switch (day) {
case 0:
console.log("Sunday");
break;
case 1:
console.log("Monday");
break;
default:
console.log("...")
}
"""for循环"""
for(起始值;循环条件;每次循环后执行的操作){
for循环体代码
}
for (var i=0;i<10;i++) {
console.log(i);
}
# 练习:如何使用for循环取出数组内的每个元素
var l1 = [111,222,333,444,555,666]
for(let i=0;i<l1.length;i++){
console.log(l1[i])
}
"""while循环"""
while(循环条件){
循环体代码
}
三元运算符
在python中
res = '吃饭' if 18 > 10 else '喝水'
在js中
res = 18 > 10 ? '吃饭':'喝水'
函数
在python中
def 函数名(参数1,参数2,...):
'''函数注释'''
函数体代码
return 返回值
在js中
function 函数名(参数1,参数2,...){
// 函数注释
函数体代码
return 返回值
}
"""
arguments参数 可以获取传入的所有数据
也支持return和匿名函数
"""
var f = v => v;
// 等同于
var f = function(v){
return v;
}
自定义对象
# 相当于python中的字典类型
方式1: var d = {'name':'jason','age':18}
方式2: var d = Object({'name':'jason','age':18})
class MyDict(dict):
def __getattr__(self, item):
return self.get(item)
def __setattr__(self, key, value):
self[key] = value
res = MyDict(name='jason',age=18)
print(res.name)
print(res.age)
res.xxx = 123
print(res.xxx)
print(res)
内置对象
# 如果需要使用内置对象 需要关键字 new
在python中
import date
date()
在js中
new date()
##########################################################
序列化
python中
import json
json.dumps() # 序列化
json.loads() # 反序列化
js中
JSON.stringify() # 序列化
JSON.parse() # 反序列化
"""
如果当前js中有一个布尔值true需要基于网络发送给python程序并且让python转换成布尔值 如何操作
1.在js中使用JSON.stringify()序列化成json格式字符串
2.基于网络发送给python程序(自动编码)
3.python接收 解码并反序列化
"""
##########################################################
regexp对象
方式1:var reg1 = new RegExp("^[a-zA-Z][a-zA-Z0-9]{5,11}");
方式2:var reg2 = /^[a-zA-Z][a-zA-Z0-9]{5,9}/;
全局匹配
正则表达式的最后不加g则表示匹配成功就结束 加g表示全局匹配
# 全局匹配会有一个lastindex属性
reg2
/^[a-zA-Z][a-zA-Z0-9]{5,9}$/g
reg2.test('jason666')
true
reg2.test('jason666')
false
reg2.lastIndex
0
reg2.test('jason666')
true
reg2.lastIndex
8
校验时不传参数默认传的是undefined
BOM与DOM操作
BOM 浏览器对象模型>>>:使用js操作浏览器
DOM 文档对象模型>>>:使用js操作前端页面
BOM操作
window.open() // 打开新窗口
window.close() // 关闭当前窗口
window.history.forward() // 前进一页
window.history.back() // 后退一页
window.location.href // 获取URL
window.location.href="URL" // 跳转到指定页面
window.location.reload() // 重新加载页面
setTimeout() // 定时事件
clearTimeout() // 清除定时事件
setInterval() // 周期事件
clearInterval() // 清除周期事件
5、前端--js常量、变量、5种基本数据类型(number string boolean undefined object)、运算符、流程控制、三元运算符、函数、自定义对象、内置对象、BOM操作的更多相关文章
- JavaScript (五) js的基本语法 - - - 面向对象、工程模式、内置对象、JSON
个人博客网:https://wushaopei.github.io/ (你想要这里多有) 一.编程思想 1.定义: 编程思想:把一些生活中做事的经验融入到程序中 面向过程:凡事都要亲力亲为,每件 ...
- js简介 基本操作 以及循环语句 内置对象 函数044
js 全称 javascript 从交互的角度 描述行为 一 .js注释方法: //单行注释 声明变量 var 二 .声明多个变量 : var a = '2' ,b = 4, c = tru ...
- JS基础语法---内置对象
js学习中三种对象: 内置对象----js系统自带的对象 自定义对象---自己定义的构造函数创建的对象 浏览器对象---BOM的时候讲 内置对象: Math Date String Array Obj ...
- js运算符、 流程控制 、函数、内置对象、BOM与DOM操作
运算符 # 1.算术运算符 var x=10; var res1=x++; '先赋值后自增1' var res2=++x; '先自增1后赋值' # 2.比较运算符 弱等于:自动转换类型 '5' == ...
- JaveScript内置对象(JS知识点归纳八)
1)JS自身提供的方式 用于对数据进行简便的操作,根据方法可以操作的数据类型不同,形成了不同的对象--内置对象 2)数组 a)基本操作方法--对数组进行修改 从数组最后进行操作 1)数组.push ...
- python 之 前端开发( JavaScript变量、数据类型、内置对象、运算符、流程控制、函数)
11.4 JavaScript 11.41 变量 1.声明变量的语法 // 1. 先声明后定义 var name; // 声明变量时无需指定类型,变量name可以接受任意类型 name= " ...
- web前端学习(四)JavaScript学习笔记部分(6)-- js内置对象
1.JS内置对象-什么是对象 1.1.什么是对象: JavaScript中的所有事物都是对象:字符串.数值.数组.函数 每个对象带有属性和方法 JavaScript允许自定义对象 1.2.自定义对象: ...
- js五种基本数据类型:string, number, boolean, null, undefined
/** * 五种基本数据类型:string, number, boolean, null, undefined */ // undefined // 声明变量foo,未声明变量bar var foo; ...
- 前端JavaScript(2) --常用内置对象,函数,伪数组 arguments,关于DOM的事件操作,DOM介绍
昨日内容回顾 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 ...
随机推荐
- 安装KVM
在VMWare安装CentOS7 选择图形界面和开发工具 设置网络 cd /etc/sysconfig/network-scripts/ vi ifcfg-ens33 BOOTPROTO=static ...
- mac 操作系统使用iterm(2)自动登录远程服务器
找一个目录创建一个普通的文件,例如 vi myprofile ,编辑以下内容 #!/usr/bin/expect set PORT 22 set HOST www.****.com(或者ip地址) s ...
- Linux上天之路(四)之Linux界面介绍
Linux界面 linux为使用者提供了图形界面和文本界面,但是很多操作依然需要文本界面的操作才能完成,很多人使用起来比较蹩脚,又因为linux平台的个人应用APP相对较少,使得大家的个人PC安装了l ...
- 通过了解Servlet和Http之间的关系,了解web中http通信使用
注:图片如果损坏,点击文章链接:https://www.toutiao.com/i6512336761551585796/ 1.<Servlet简单实现开发部署过程> 2.<Serv ...
- 论文翻译:2021_ICASSP 2021 ACOUSTIC ECHO CANCELLATION CHALLENGE: INTEGRATED ADAPTIVE ECHO CANCELLATION WITH TIME ALIGNMENT AND DEEP LEARNING-BASED RESIDUAL ECHO PLUS NOISE SUPPRESSION
论文地址:https://ieeexplore.ieee.org/abstract/document/9414462 ICASSP 2021声学回声消除挑战:结合时间对准的自适应回声消除和基于深度学习 ...
- Configmap-K8s容器的配置文件
传递配置给容器化应用程序有几种方式: 嵌入应用本身: 通过命令行传递参数: 通过环境变量传递参数: 在k8s中无论你有没有使用configmap,以下方法均可以配置应用程序: 向容器传递命令行参数:c ...
- Javascript实现让图片一直跟着鼠标移动
Javascript实现让图片一直跟着鼠标移动 注意:图片可能加载不出来,还请及时更换图片 <!doctype html> <html> <head> <me ...
- 【算法】nSum问题
LeetCode中出现了2sum, 3sum, 4sum的问题,文章给出了一种通用的解法,想法是将n_sum问题转换为(n-1)_sum问题,具体步骤如下: 定义函数sum(n, target),表示 ...
- ☕【Java深层系列】「并发编程系列」让我们一起探索一下CyclicBarrier的技术原理和源码分析
CyclicBarrier和CountDownLatch CyclicBarrier和CountDownLatch 都位于java.util.concurrent这个包下,其工作原理的核心要点: Cy ...
- STM32定时器触发ADC多通道连续采样,DMA缓存结果
STM32的ADC使用非常灵活,采样触发方面:既支持软件触发,定时器或其他硬件电路自动触发,也支持转换完成后自动触发下一通道/轮转换.转换结果存储方面:既支持软件读取和转存,也支持DMA自动存储转换结 ...