JavaScript重点记忆

Posted 2020-09-27 lakeslove

String的常用方法

indexOf()	返回字符串中检索指定字符第一次出现的位置
lastIndexOf()	返回字符串中检索指定字符最后一次出现的位置

 

match()	找到一个或多个正则表达式的匹配
replace()	替换与正则表达式匹配的子串

split()	把字符串分割为子字符串数组
substr()	从起始索引号提取字符串中指定数目的字符
substring()	提取字符串中两个指定的索引号之间的字符

trim()

移除字符串首尾空白

 

var person = null;           // 值为 null(空), 但类型为对象

var person = undefined;     // 值为 undefined, 类型为 undefined

 Undefined 和 Null 的区别

对象只有被定义才有可能为 null，否则为 undefined。

typeof undefined             // undefined
typeof null                  // object
null === undefined           // false
null == undefined            // true

 

5 + null    // 返回 5         null 转换为 0
"5" + null  // 返回"5null"   null 转换为 "null"
"5" + 1     // 返回 "51"      1 转换为 "1"  
"5" - 1     // 返回 4         "5" 转换为 5

 

/runoob/i  是一个正则表达式。

var txt = str.replace(/microsoft/i,"Runoob");

var txt = str.replace("Microsoft","Runoob");

 

var str = "Visit Runoob!";

var n = str.search("Runoob");

search() 方法 用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串，并返回子串的起始位置。

 

i	执行对大小写不敏感的匹配。
g	执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。

正则表达式模式

方括号用于查找某个范围内的字符：

表达式	描述
[abc]	查找方括号之间的任何字符。
[0-9]	查找任何从 0 至 9 的数字。
(x|y)	查找任何以 | 分隔的选项。

元字符是拥有特殊含义的字符：

元字符	描述
\d	查找数字。
\s	查找空白字符。
\b	匹配单词边界。
\uxxxx	查找以十六进制数 xxxx 规定的 Unicode 字符。

量词:

量词	描述
n+	匹配任何包含至少一个 n 的字符串。
n*	匹配任何包含零个或多个 n 的字符串。
n?	匹配任何包含零个或一个 n 的字符串。

test() 方法用于检测一个字符串是否匹配某个模式，如果字符串中含有匹配的文本，则返回 true，否则返回 false。

var patt = /e/;
patt.test("The best things in life are free!");

字符串中含有 "e"，所以该实例输出为：true

exec() 方法用于检索字符串中的正则表达式的匹配。

该函数返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。

/e/.exec("The best things in life are free!");

字符串中含有 "e"，所以该实例输出为:e

var part = /e/g;
// var result = part.exec("The best things in life are free!");
var result = "The best things in life are free!".match(part);
alert(result)

输出 e,e,e,e,e,e

debugger 关键字

 var x = 15 * 5; debugger; document.getElementbyId("demo").innerhtml = x;

console.log() 方法

变量提升：函数声明和变量声明总是会被解释器悄悄地被"提升"到方法体的最顶部。

javascript 只有声明的变量会提升，初始化的不会。

JavaScript 严格模式(strict mode)不允许使用未声明的变量。

严格模式通过在脚本或函数的头部添加 "use strict"; 表达式来声明。

function myFunction() {
   "use strict";
    y = 3.14;   // 报错 (y 未定义)
}

在常规的比较中，数据类型是被忽略的，比如10=="10"为true

在严格的比较运算中，=== 为恒等计算符，同时检查表达式的值与类型，比如10==="10" 为false

JavaScript 中的所有数据都是以 64 位浮点型数据(float) 来存储。

所有的编程语言，包括 JavaScript，对浮点型数据的精确度都很难确定：

var x = 0.1;
var y = 0.2;
var z = x + y            // z 的结果为 0.30000000000000004
if (z == 0.3)            // 返回 false

字符串断行需要使用反斜杠(\)，如下所示:

var x = "Hello World!";

 

form表单

var x = document.forms["myForm"]["fname"].value;

<form name="myForm" action="demo_form.php" onsubmit="return validateForm()" method="post">
名字: <input type="text" name="fname">
<input type="submit" value="提交">
</form>

 

// 判断输入是否为数字
function isNumeric(n) {
    return !isNaN(parseFloat(n)) && isFinite(n);
}

JSON.parse()	用于将一个 JSON 字符串转换为 JavaScript 对象。
JSON.stringify()	用于将 JavaScript 值转换为 JSON 字符串。

<a href="javascript:void(0)">单击此处什么也不会发生</a>

<a href="javascript:void(alert(‘Warning!!!‘))">点我!</a>

href="#"与href="javascript:void(0)"的区别

# 包含了一个位置信息，默认的锚是#top 也就是网页的上端。

而javascript:void(0), 仅仅表示一个死链接。

在页面很长的时候会使用 # 来定位页面的具体位置，格式为：# + id。

如果你要定义一个死链接请使用 javascript:void(0) 。

 

JavaScript 函数

在函数表达式存储在变量后，变量也可作为一个函数使用：
实例
var x = function (a, b) {return a * b};
var z = x(4, 3);

如果表达式后面紧跟 () ，则会自动调用。

不能自调用声明的函数。

(function () {
    var x = "Hello!!";      // 我将调用自己
})();

JavaScript 函数有个内置的对象 arguments 对象。

argument 对象包含了函数调用的参数数组。

arguments.length 属性返回函数调用过程接收到的参数个数（准确说是调用者传递的参数个数）：

建议最好为参数设置一个默认值:

function myFunction(x, y) {
    y = y || 0;
}

当函数没有被自身的对象调用时， this 的值就会变成全局对象。

 函数作为对象方法调用，会使得 this 的值成为对象本身。

call() 和 apply() 是预定义的函数方法。 两个方法可用于调用函数，两个方法的第一个参数必须是对象本身。

 

两个方法都使用了对象本身作为第一个参数。 两者的区别在于第二个参数： apply传入的是一个参数数组，也就是将多个参数组合成为一个数组传入，而call则作为call的参数传入（从第二个参数开始）。

JavaScript 闭包

闭包是可访问上一层函数作用域里变量的函数，即便上一层函数已经关闭。

闭包实例 ：计数器

var add = (function () {
    var counter = 0;
    return function () {return counter += 1;}
})();

add();
add();
add();

// 计数器为 3

 

这个叫作 JavaScript 闭包。它使得函数拥有私有变量变成可能。

计数器受匿名函数的作用域保护，只能通过 add 方法修改。

或者这样

function a(){
var i=0;
function b(){
alert(++i);
}
return b;
}
var c=a();
c();

而且闭包是相对独立的，如下的c和d虽然都是调用了a(),但是互不干扰。

<body>
    <p>局部变量计数。</p>
    <button type="button" onclick="myFunction()">计数!</button>
     <button type="button" onclick="myFunction2()">计数2!</button>
    <p id="demo">0</p>
    <p id="demo2">0</p>
    <script>
        function a() {
            var i = 0;

            function b() {
                alert(++i);
                return i;
            }
            return b;
        }
        var c = a();

        function myFunction() {
            document.getElementById("demo").innerHTML = c();
        }
        
        var d = a();
        function myFunction2() {
            document.getElementById("demo2").innerHTML = d();
        }
    </script>

</body>

 

 

以上是关于JavaScript重点记忆的主要内容，如果未能解决你的问题，请参考以下文章

昨天是第一天的学习，记忆一下

一张图帮你记忆，Spring Boot 应用在启动阶段执行代码的几种方式

VSCode自定义代码片段12——JavaScript的Promise对象

VSCode自定义代码片段12——JavaScript的Promise对象

30秒就能看懂的JavaScript 代码片段

03 增删改查(重点--记忆)这部分内容过多，未来会重新整理