Frontend — 内置对象

JavaScript 没有标准库，但是有一些内置对象，可以不需要导入就使用一些类似其他语言的标准库的方法。

Object #

assign #

keys #

hasOwnProperty #

判断 key 是否在对象中。

function main() {
    a = {hello: "world"}

    if ("hello" in a) {
        console.log("has 1")
    }

    if (a.hasOwnProperty("hello")) {
        console.log("has 2")
    }
}
// output:
// has 1
// has 2

undefined #

undefined 表示的是一个变量为初始化时没有被赋值，得到的就是 undefined。

不在对象中时会得到 undefined：

var twoSum = function (nums, target) {
    let map = {};
    for (let i = 0; i < nums.length; i++) {
        let diff = target - nums[i];
        if (map[diff] !== undefined) {
            return [map[diff], i];
        }
        map[nums[i]] = i;
    }
};

null #

null 是一个空对象指针，表示“空值”，使用 typeof 得到 object，所以是一个特殊的对象值。

Boolean #

true or false

Number #

JavaScript 中只有一种数字类型，基于双精度 64 位二进制格式的值（$-(2^{53})-1$ 到 $2^{53}-1$）。

除了能够表示浮点数外，还有一些带符号的值：+Infinity （正无穷），-Infinity （负无穷）和 NaN (非数值，Not-a-Number)，

要检查值是否大于或小于 +/-Infinity，可以使用常量 Number.MAX_VALUE 和 Number.MIN_VALUE。另外在 ECMAScript 6 中，也可以通过 Number.isSafeInteger() 方法还有 Number.MAX_SAFE_INTEGER 和 Number.MIN_SAFE_INTEGER 来检查值是否在双精度浮点数的取值范围内。 超出这个范围，JavaScript 中的数字就不再安全了。

数字类型中只有一个整数有两种表示方法： 0 可表示为 -0 和 +0（“0” 是 +0 的简写）。 在实践中，这也几乎没有影响。 例如 +0 === -0 为真。 但是，可能要注意除以0的时候：

42 / +0; // Infinity
42 / -0; // -Infinity

Array #

let iterable = [10, 20, 30];

push #

像数组的末尾添加一个或多个元素，并返回新的长度。

const animals = ['pigs', 'goats', 'sheep'];

const count = animals.push('cows');
console.log(count);
// expected output: 4

pop #

The pop() method removes the last element from an array and returns that element. This method changes the length of the array.

const plants = ['broccoli', 'cauliflower', 'cabbage', 'kale', 'tomato'];

console.log(plants.pop());
// expected output: "tomato"

console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage", "kale"]

plants.pop();

console.log(plants);
// expected output: Array ["broccoli", "cauliflower", "cabbage"]

shift #

The shift() method removes the first element from an array and returns that removed element. This method changes the length of the array.

const array1 = [1, 2, 3];

const firstElement = array1.shift();

console.log(array1);
// expected output: Array [2, 3]

console.log(firstElement);
// expected output: 1

unshift #

向数组的开头添加一个或更多元素，并返回新的长度。

const array1 = [1, 2, 3];

console.log(array1.unshift(4, 5));
// expected output: 5

console.log(array1);
// expected output: Array [4, 5, 1, 2, 3]

splice #

从数组中添加/删除项目，返回被删除的项目，并且会改变原数组。

const months = ['Jan', 'March', 'April', 'June'];
months.splice(1, 0, 'Feb');
// inserts at index 1
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "June"]

months.splice(4, 1, 'May');
// replaces 1 element at index 4
console.log(months);
// expected output: Array ["Jan", "Feb", "March", "April", "May"]

语法

splice(start)
splice(start, deleteCount)
splice(start, deleteCount, item1)
splice(start, deleteCount, item1, item2, itemN)

slice #

切片需要使用 slice 方法。

let stack = new Array().fill(0)

stack.unshift(1)
stack.unshift(2)
stack.unshift(3)
stack = stack.slice(0, 1)
console.log(stack);
// [ 3 ]

concat 合并 #

使用 concat 合并一个或多个数组。

const array1 = ['a', 'b', 'c'];
const array2 = ['d', 'e', 'f'];
const array3 = array1.concat(array2);

console.log(array3);
// expected output: Array ["a", "b", "c", "d", "e", "f"]

String #

https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/String

let iterable = "boo";

Map #

Map 和 Object 使用时有区别

使用上，Map 只能通过 has、get 和 set 获取数据，而不能用对象的方式。

let m = new Map()

m['a'] = 1
m.set('b', 2)
m.get('b')

console.log(m)//Map(1) { 'b' => 2, a: 1 }
console.log(m['a'])//1
console.log(m.has('a'))//false
console.log(m.get('a'))//undefined

还有一些不太常用的方法。

clear #

移除 Map 对象中的所有元素。

delete #

移除 Map 对象中指定的元素。

entries #

返回一个新的包含 [key, value] 对的 Iterator 对象，返回的迭代器的迭代顺序与 Map 对象的插入顺序相同。

forEach #

按照插入顺序依次对 Map 中每个键/值对执行一次给定的函数。

function logMapElements(value, key, map) {
  console.log(`m[${key}] = ${value}`);
}

new Map([['foo', 3], ['bar', {}], ['baz', undefined]])
  .forEach(logMapElements);

// expected output: "m[foo] = 3"
// expected output: "m[bar] = [object Object]"
// expected output: "m[baz] = undefined"

keys #

返回一个引用的 Iterator 对象。它包含按照顺序插入 Map 对象中每个元素的 key 值。

values #

返回一个新的 Iterator 对象。它包含按顺序插入 Map 对象中每个元素的 value 值。

Set #

Set 对象是值的集合，你可以按照插入的顺序迭代它的元素。Set 中的元素只会出现一次，即 Set 中的元素是唯一的。

涉及的接口主要是 add，delete，has 等，其他和 Map 差不多。

Symbol #

eval #

call #

encodeURIComponent

setInterval

setTimeout

arguments 对象 #

example1:

(function() {
  for (let argument of arguments) {
    console.log(argument);
  }
})(1, 2, 3);

// 1
// 2
// 3

example2:

function foo(n) {
  // 隐式绑定 foo 函数的 arguments 对象. arguments[0] 是 n,即传给foo函数的第一个参数
  var f = () => arguments[0] + n;
  console.log(f());
}

foo(1); // 2
foo(2); // 4
foo(3); // 6
foo(3,2);//6

JSON #

JSON.stringify 方法将一个 JavaScript 对象或值转换为 JSON 字符串

RegExp #

RegExp.$1 用来匹配正则里的分组。

方法描述
exec一个在字符串中执行查找匹配的RegExp方法，它返回一个数组（未匹配到则返回 null）。
test一个在字符串中测试是否匹配的RegExp方法，它返回 true 或 false。
match一个在字符串中执行查找匹配的String方法，它返回一个数组，在未匹配到时会返回 null。
matchAll一个在字符串中执行查找所有匹配的String方法，它返回一个迭代器（iterator）。
search一个在字符串中测试匹配的String方法，它返回匹配到的位置索引，或者在失败时返回-1。
replace一个在字符串中执行查找匹配的String方法，并且使用替换字符串替换掉匹配到的子字符串。
split一个使用正则表达式或者一个固定字符串分隔一个字符串，并将分隔后的子字符串存储到数组中的 String 方法。

标志符

标志描述
g全局搜索。
i不区分大小写搜索。
m多行搜索。
s允许 . 匹配换行符。
u使用unicode码的模式进行匹配。
y执行“粘性(sticky)”搜索,匹配从目标字符串的当前位置开始。

当我们指定g标志后，每次运行exec()，正则表达式本身会更新lastIndex属性，表示上次匹配到的最后索引。

Math #

max #

floor #

Math.floor() 向下取整

Math.floor(3.141592654) // 3
console.log(Math.floor(-5.05));//-6

ceil #

Math.ceil() 向上取整

Math.ceil(3.141592654) // 4
console.log(Math.ceil(-7.004)); // -7

round #

Math.round 四舍五入

Math.round(3.141592654) // 3

parseInt #

parseInt() 去掉小数点和小数点后的部分

parseInt(3.141592654) // 3

random #

获取一个小于 100 的整数随机数。

let random = Math.floor(Math.random() * 100);

Proxy #

Proxy 对象用于创建一个对象的代理，从而实现基本操作的拦截和自定义（如属性查找、赋值、枚举、函数调用等）。

XMLHttpRequest #

XMLHttpRequest (XHR) 是一种创建 AJAX 请求的 JavaScript API 。它的方法提供了在浏览器和服务器之间发送请求的能力。

Ajax #

AJAX（Asynchronous JavaScript And XML ）是一种使用 XMLHttpRequest 技术构建更复杂，动态的网页的编程实践。

Fetch API #

本文共 2115 字，上次修改于 Jul 9, 2024
相关标签： JavaScript, Frontend