Javaweb学习笔记day03---JavaScript

最新推荐文章于 2022-09-07 20:24:56 发布

Mr.W.code

最新推荐文章于 2022-09-07 20:24:56 发布

阅读量301

点赞数

分类专栏：笔记 sql java 文章标签：算法 leetcode java

本文链接：https://blog.csdn.net/Wynb1020/article/details/121624788

版权

笔记同时被 3 个专栏收录

70 篇文章 2 订阅

订阅专栏

java

37 篇文章 0 订阅

订阅专栏

sql

12 篇文章 0 订阅

订阅专栏

Number对象

概述

Date对象

概述
用于处理日期时间

代码实现

String对象

RegExp对象

概述

	表示正则表达式，他是对字符串执行模式匹配的强大工具

代码实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>RepExp对象</title>
</head>
<body>
<script>
//1、创建正则对象
var reg=/[1]{1}[3456789]{1}[0-9]{9}/;
//2、获取输入的手机号
var phoneNum = "13627185850";
//3、匹配
console.log(reg.test(phoneNum));
</script>
</body>
</html>

Array对象

Json对象

概述
用于将js对象转换为json字符创，将json字符串转换为js对象的一个工具类

BOM对象

概述

Window：Window 对象表示浏览器中打开的窗口。
代码实现
Navigator ：Navigator 对象包含有关浏览器的信息。
Screen ：Screen 对象包含有关客户端显示屏幕的信息。
History ：History 对象包含用户（在浏览器窗口中）访问过的 URL。
Location ：Location 对象包含有关当前 URL 的信息。
sessionStorage和localStorage对象:sessionstorage是当前页面；localstorage是整个浏览器共享，及时关闭浏览器数据依据存在
代码实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>BOM对象之sessionStorage</title>
</head>
<body>
 <button onclick="fn1()">设置sessionStorage</button>
 <button onclick="fn2()">获取sessionStorage</button>
 <button onclick="fn3()">移除sessionStorage</button>
</body>
<script>
  function fn1() {
    var user = {
      "id" : 1,
      "name" : "楚留香"
    };
    //user -> json字符串
    var jsonStr = JSON.stringify(user);
    sessionStorage.setItem("user",jsonStr);
  }
  function fn2() {
      var jsonStr = sessionStorage.getItem("user");
      //json字符串  - >user
    var user = JSON.parse(jsonStr);
    console.log(user.name);
  }
  function fn3() {
      sessionStorage.removeItem("user");
  }
</script>
</html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>BOM对象之localStorage</title>
</head>
<body>
<button onclick="fn1()">设置localStorage</button>
<button onclick="fn2()">获取localStorage</button>
<button onclick="fn3()">移除localStorage</button>
</body>
<script>
  function fn1() {
    localStorage.setItem("msg","歪比巴卜");
  }
  function fn2() {
      var msg = localStorage.getItem("msg");
      console.log(msg)
  }
  function fn3() {
        localStorage.removeItem("msg")
  }
</script>
</html>

注意事项
sessionStorage和localStorage只能存储字符串，如果想要存储对象信息
在存储时，需要将js对象转换为json字符串，然后存储就送字符串；
在取出时，需要将json字符串转换为js对象，然后进行使用

正则表达式

正则表达式概述

		数字hi一个用来描述或者撇皮一系列符合某个语法规则的字符串的单个字符串。其实就是一种规则。有字节特殊的应用。

使用场景

		比如：注册和登录工能中，输入的账户、密码、手机号、邮箱等等都可以使用正则表达式格式进行校验

字符类演示

代码实现


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>字符类演示</title>
</head>
<body>
</body>
<script>

    // [abc] a、b 或 c（简单类）
    var reg1 = /^[abc]$/;
    console.log(reg1.test("a"));
    // [^abc] 任何字符，除了 a、b 或 c（否定）
    var reg2 = /^[^abc]$/;
    console.log(reg2.test("ef"));
    // [a-zA-Z] a到 z 或 A到 Z，两头的字母包括在内（范围）
    var reg3 = /^[a-zA-Z]$/;
    console.log(reg3.test("ab"));
    // [0-9] 0到9的字符都包括
    var reg4 = /^[0-9]$/;
    console.log(reg4.test("a"));


</script>
</html>

预定义字符类演示

概述
系统已经与设好的一些字符类，开发人员可以直接使用
代码实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>与定义字符类</title>
</head>
<body>
</body>
<script>
  // . 任何字符。
  var reg1 = /^,$/;
  console.log(reg1.test("11"));
  // \d 数字：[0-9]
  var reg2 = /^\d$/;
  console.log(reg2.test("a"));
  // \D 非数字:[^0-9]
  var reg3 = /^\D$/;
  console.log(reg3.test("dad"));
  // \w 单词字符：[a-zA-Z_0-9]
  var reg4 = /^\w$/;
  console.log(reg3.test("g"));
  // \W 非单词字符:[^\w]
  var reg5 = /^\W$/;
  console.log(reg5.test("!"));
  // \s 空白字符:[ \t\n\x0B\f\r]
  var reg6 = /^\s$/;
  console.log(reg6.test(" "));
  // \S 非空白字符:[^\s]
  var reg7 = /^\S$/;
  console.log(reg7.test("3"));
</script>
</html>

数量词

概述
- 规定字符串的长度
代码实现

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数量词演示</title>
</head>
<body>
</body>
<script>

    // X? :X，一次或一次也没有
    var reg1 = /^[a]?$/;
    console.log(reg1.test("aa"));
    // X* :X，零次到多次
    var reg1 = /^[a]*$/;
    console.log(reg1.test("bb"));
    // X+ :X，一次到 多次
    var reg1 = /^[a]+$/;
    console.log(reg1.test("a"));
    // X{n} :X，恰好 n 次
    var reg1 = /^[a]{2}$/;
    console.log(reg1.test("aaa"));
    // X{n,} :X，至少 n 次
    var reg1 = /^[a]{2,}$/;
    console.log(reg1.test("a"));
    // X{n,m} :X，至少 n 次，但是不超过 m 次
    var reg1 = /^[a]{2,5}$/;
    console.log(reg1.test("aaaaa"));

</script>
</html>