学习js的一些笔记
1,对变量的一些认识
在学习java的过程中,我对变量的理解,其实就是一个在运行期进行简单储存的数据的内存空间,运行期结束后就会在各个代码的垃圾回收机制中在内存空间中消除。
对于变量,在java中,一个被创建的变量,就只能储存同类型的数据,除了多态有一些简简单单的例外之外(父类变量存储子类对象)
但在学习js的过程中,我发现,一个被定义的变量,并不一定只能储存一个类型的数据!
比如:
var a ="123";
a=123;
这样的代码在java中是绝对不能实现的,一个储存了字符串数据类型的变量,是绝对不可能再储存整型。然而在js中却可以。
现在我们来说一说变量:
变量实际上是在内存中开辟了一个空间,用来存储一个数据!
在java这种强类型的变量语言中,在创建变量开辟空间的时候,java将这个内存空间所储存的类型所固定,使之只能存储固定类型的数据,
而js这种弱类型的语言中,只开辟了空间,并没有固定其所存储的数据类型,所以可以随意的转换!
(所有的强类型语言都会这样,弱类型也是)
js变量演示:
typeof(变量名)可以获取变量类型
//定义number类型
let a =123;
let b =123.1;
let c =NaN;
document.write(a+"----"+typeof(a)+"<br>");
document.write(b+"----"+typeof(b)+"<br>");
document.write(c+"----"+typeof(c)+"<br>");
//定义String类型
let a1="123";
let b1='123';
let c1="abv";
document.write(a1+"----"+typeof(a1)+"<br>");
document.write(b1+"----"+typeof(b1)+"<br>");
document.write(c1+"----"+typeof(c1)+"<br>");
document.write("<br>");
//定义boolean类型
let a2=false;
let b2=true;
document.write(a2+"----"+typeof(a2)+"<br>");
document.write(b2+"----"+typeof(b2)+"<br>");
document.write("<br>");
//定义null
let a3=null;
let b3=undefined;
let c3;
document.write(a3+"----"+typeof(a3)+"<br>");
document.write(b3+"----"+typeof(b3)+"<br>");
document.write(c3+"----"+typeof(c3));
document.write("<br>");
输出结果:
123----number
123.1----number
NaN----number
123----string
123----string
abv----string
false----boolean
true----boolean
null----object
undefined----undefined
undefined----undefined
js这里有个小问题,用var或者let可以定义变量,但直接不写,也可以定义变量,两者区别在于,var和let定义的是局部变量,不写直接是全局变量!
2,流程控制语句Switch
Switch语句结构:
Switch(变量):
•case 值:
在Java中,Switch能接受的数据类型:byte short int long char 枚举(1.5) 字符串(1.7)
但在js中, Switch能接受任意类型的数据!
3,一个简单的练习,在页面上输出99乘法表
<script>
document.write("<table align='center' >");
for (let i = 1 ; i < 10 ; i++){
document.write("<tr>");
for (let j = 1 ; j <= i ; j++){
document.write("<td>");
document.write(i + "*" + j + "=" + i*j);
document.write("</td>");
}
document.write("</tr>");
// document.write("<br>");
}
document.write("</table>");
</script>
<style>
td{
border: 1px solid;
}
</style>
4,js的常见对象
Function对象(函数对象)
1,创建
三种:
1,基本不用,看个热闹
let fun = new function(形式参数列表,方法体);
2,这个和java方法挺像的,用的非常多,可记
function 方法名(形式参数列表){
方法体
}
例:
function a(a1,b1){
document.write(a1+b1);
}
3,这个用的也比较多
let 方法名 = function(形参列表){
方法体;
}
例:
let a =function(a1 , b1 ){
document.write(a1+b1);
}
2,方法
3,属性
1,length属性:代表形参的个数。
使用方式
对象名.length
4,特点
1,方法定义的时候,形参和返回值的类型不用写,反正都是var或者let,写了也没啥用
2,方法是一个对象,如果重复定义,会覆盖而不会报错。
3,在js中,方法的调用只与方法名有关,与形参列表无关
4,在方法声明中只有一个隐藏的内置对象(数组),arguments,封装所有实际参数
5,调用
方法名(实际参数列表)
Array对象(数组对象)
1,创建
也是三种:
1,
let 数组名 = new Array(元素列表);
2,
let 数组名 = new Array(默认长度);
3,
let 数组名 = [元素列表];
2,方法
1,jion(参数):将数组中的元素按照指定的分隔符进行分割,,例:
let a1 = new Array(5);
for (let i = 0 ; i < a1.length ; i++){
a1[i]=i;
}
document.write(a1.join("--")+"<br>");
打印效果:
0--1--2--3--4
2,向数组末尾添加一个或更多元素,并返回新的长度,,例(接上面的代码):
document.write(a1.push("5",6)+"<br>");
打印效果:
0--1--2--3--4
7
3,属性
length,数组长度
4,特点
1,js中,数组元素的类型是可以变的,可以理解为java的Obj类型数组
2,js中,数组长度可变
Date对象(时间对象)
1,创建
var 对象名 = new Date();
2 ,方法
toLocaleString(),返回当前date对象对应的时间本地字符串格式
let a2 =new Date();
document.write(a2+"<br>");
document.write(a2.toLocaleString()+"<br>");
打印结果:
Tue Dec 27 2022 18:36:03 GMT+0800 (中国标准时间)
2022/12/27 18:36:03
getTime(),返回当前毫秒值,,返回当前时间与1970年1月1日0点0分的毫秒值差
document.write(a2.getTime()+"<br>");
打印结果:
1672137363540
Math对象(数学对象)
1,创建
这个对象很特殊,不需要创建,直接使用
使用:Math.方法名();、
2,方法
1,random(),返回一个0.0到1.0之间的伪随机数(含0不含1)
document.write(Math.random()+"<br>");
打印结果:
0.14629435714864747
2,ceil(参数),对数进行向上舍入
document.write(Math.ceil(Math.PI)+"<br>");
打印结果:
4
3,floor(参数),对数进行向下舍入
document.write(Math.floor(Math.PI)+"<br>");
打印结果:
3
4,round(x),把数四舍五入为最近的整数
document.write(Math.round(Math.PI)+"<br>");
打印结果:
3
3,属性
PI 圆周率
document.write(Math.PI+"<br>")
打印结果:
3.141592653589793
小练习:1-100间的随即整数:
<script>
function suiji(){
return Math.floor(Math.random()*99);
}
for (let i = 0 ; i < 100 ; i ++){
document.write(suiji()+",")
}
</script>
打印结果:
25,78,25,91,84,68,11,10,19,10,31,31,25,2,91,91,86,74,52,10,67,7,7,83,19,68,89,19,75,25,54,52,87,16,47,44,40,72,29,68,55,0,37,39,73,55,44,28,41,84,78,84,24,88,83,68,5,22,84,53,9,70,25,22,6,51,2,37,71,24,66,98,10,48,75,68,82,31,63,94,56,11,81,74,95,98,44,30,37,60,90,29,71,0,90,8,35,51,43,75,
RegExp对象(正则表达式对象)
正则都知道吧?
说一下js里的正则规则:
1,正则表达式
1,单个字符:[]
例:
表示单个a: [a];
•表示a或b: [ab];
•表示a到z: [a-z];
•表示a到z或者A到Z: [a-zA-Z];
•表示a到z或者A到Z或者0到9或者下划线: [a-zA-Z0-9_];
特殊的单个字符表示:
/d:单个数字,,也就相当于[0-9]
/w: 单个字符,,相当于[a-zA-z0-9_]
2,量词符号:
?:表示0次或1次
*: 表示0次或多次
+: 表示1次或多次
{m,n}:表示 m <= 数量 <= n
这里如果m没写,就是这样{,n}:表示最多有n个
n没写,{m,} :表示最少有m个
3,开始结束符号
^: 开始
$: 结束
小练习:输入账号,要求6-12位,的字符
/w{6,12}
2,正则对象
创建
1,
let 对象名 = new RegExp("\正则表达式");
2,
let 对象名 = /正则表达式/;
方法
tast(参数) :验证指定字符是否符合正则规则,符合返回true,不符合返回false
Global对象(全局对象)
1,特点
全局对象,这个Global中封装的方法不需要对象就可以直接调用。
方法名();
2,方法
1,encodeURI(): url编码
let gl = encodeURI("鹏哥真帅");
document.write(gl);
打印结果:
%E9%B9%8F%E5%93%A5%E7%9C%9F%E5%B8%85
2,decodeURI(): url解码
document.write(decodeURI(gl));
打印结果:
鹏哥真帅
3,encodeURIComponent():url 编码
这两个和上面两个的区别就在于参数的大小,对于大量数据的解码,编码,用这两个长的,比较好
4,decodeURIComponent():url 解码
编码方式
这里介绍一下,浏览器的编码方法:
假设现在有汉字:
鹏哥真帅
现在,假设用GBK码的编码方式,那么一个汉字是2个字节,一个字节是8位2进制数
那么鹏哥真帅这四个字,就会有32位字节
现在,我们再假设,鹏哥真帅 这四个字的编码为
10010010 10010010 10010010 10010010
这32位,然后咱们以8位为限制,转换成数字,中间以%隔开,那么最后得到一个结果(这里也是假设哈,我直接用encodeURI()这个方法 的编码出来了,结果如下)
%E9%B9%8F%E5%93%A5%E7%9C%9F%E5%B8%85
学习js的一些笔记的更多相关文章
- 前端学习:JS(面向对象)代码笔记
前端学习:JS(面向对象)代码笔记 前端学习:JS面向对象知识学习(图解) 创建类和对象 创建对象方式1调用Object函数 <body> </body> <script ...
- js便签笔记(12)——浏览TOM大叔博客的学习笔记 part2
1. 前言 昨天写了<js便签笔记(11)——浏览TOM大叔博客的学习笔记 part1>,简单记录了几个问题.part1的重点还是在于最后那个循环创建函数的问题,也就是多个子函数公用一个闭 ...
- canvas学习之API整理笔记(二)
前面我整理过一篇文章canvas学习之API整理笔记(一),从这篇文章我们已经可以基本了解到常用绘图的API.简单的变换和动画.而本篇文章的主要内容包括高级动画.像素操作.性能优化等知识点,讲解每个知 ...
- Js replace() 方法笔记
最近捣鼓着学习Js,发现replace()真的很有用,替换功能杠杠的棒. 接下来看看我遇到的问题: 有两个随机给出的字符串,字符串1'xxxxxx',字符串2'====T'(这两个用作示例,其他为随机 ...
- 学习js回调函数
<!DOCTYPE HTML> <html> <head> <meta charset="GBK" /> <title> ...
- JS SDK 随手笔记
JS SDK 随手笔记 窗口模块 Frame/Multi Frame 对话框 页面间的通讯 生命周期 窗口层叠 窗口模块 窗口模块是是AppCan移动应用界面最基本的单位.窗口是每个界面布局的基础,他 ...
- js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定
js高级程序设计笔记之-addEventListener()与removeEventListener(),事件解除与绑定 addEventListener()与removeEventListener( ...
- 学习Logistic Regression的笔记与理解(转)
学习Logistic Regression的笔记与理解 1.首先从结果往前来看下how logistic regression make predictions. 设我们某个测试数据为X(x0,x1, ...
- 转载-《Python学习手册》读书笔记
转载-<Python学习手册>读书笔记 http://www.cnblogs.com/wuyuegb2312/archive/2013/02/26/2910908.html
- python学习第五次笔记
python学习第五次笔记 列表的缺点 1.列表可以存储大量的数据类型,但是如果数据量大的话,他的查询速度比较慢. 2.列表只能按照顺序存储,数据与数据之间关联性不强 数据类型划分 数据类型:可变数据 ...
随机推荐
- 关于Redhat-7.x-下docker的安装记录
今天因公司项目,需要部署docker环境,能根据指定的镜像创建容器 于是首先就得先部署docker环境,过程记录如下: 在Redhat 7.x - (aws上的Redhat) 环境下部署过程 1.安装 ...
- python-绘图与可视化
python 有许多可视化工具,但本书只介绍Matplotlib.Matplotlib是一种2D的绘图库,它可以支持硬拷贝和跨系统的交互,它可以在python脚本,IPython的交互环境下.Web应 ...
- CentOS 7.9 安装 ELK
一.CentOS 7.9 安装 elasticsearch-7.8.1 地址 https://www.elastic.co https://www.elastic.co/cn/downloads/pa ...
- 一篇文章带你掌握MyBatis简化框架——MyBatisPlus
一篇文章带你掌握MyBatis简化框架--MyBatisPlus 我们在前面的文章中已经学习了目前开发所需的主流框架 类似于我们所学习的SpringBoot框架用于简化Spring开发,我们的国人大大 ...
- jquery+bootstrap学习笔记
最近小颖接了个私活,客户要求用jquery和bootstrap来实现业务需求,小颖总结了下在写的过程中的一下坑,来记录一下 1.动态加载html文件 switch (_domName) { case ...
- Linux基础_2_bash功能
查看当前shell:echo $SHELL 查看可用shell:cat /etc/shells 命令行编辑 光标跳到行首:Ctrl+a 光标跳到行尾:Ctrl+e 以单词为单位快速跳转光标:Ctr ...
- 微服务开发框架-----Apache Dubbo
文章目录 一.简介 二.概念与架构 一.简介 Apache Dubbo 是一款微服务开发框架,提供了RPC通信与微服务治理两大关键能力.使用Dubbo开发的微服务,将具备相互之间的远程发现与通信能力, ...
- python环境安装(pyhon和pycharm)
一.python安装 在地址栏输入https://www.python.org/进入python官网, 点击windows后会出现各种可供下载的历史版本, 安装包下载后,双击运行 点击下一步 勾选下面 ...
- NLP之基于Seq2Seq的单词翻译
Seq2Seq 目录 Seq2Seq 1.理论 1.1 基本概念 1.2 模型结构 1.2.1 Encoder 1.2.2 Decoder 1.3 特殊字符 2.实验 2.1 实验步骤 2.2 算法模 ...
- python枚举类型 Enum
在python中枚举是一种类(Enum) 枚举类中不能存在相同的标签名 枚举是可迭代的 例: from enum import Enum class Vip(Enum): MONDAY = 0 TUE ...