回复下方公众号【面试宝典】javascript 数字格式，即可获取为你整理的107页后端面试题。
JavaScript 包含对典型编程思想有用的各种方法。 在实际开发中，我们一般希望减少代码行数； 因此，今天这个方法代码希望对您有所帮助。
1. 与Javascript对象相关
01)、对象解释
将对象的值重构为变量是在传统点表示法之外读取其值的另一种方法。
下面的示例将读取对象值的规范点表示法与对象重构快捷方式进行了比较。
const restaurant = {
name: "Classico Italiano",
menu: ["Garlic", "Bread", "Salad", "Pizza", "Pasta"],
openingHours: {
friday: { open: 11, close: 24 },
saturday: { open: 12, close: 23 },
},
};
// Longhand
console.log("value of friday in restaurant:", restaurant.openingHours.friday);
console.log("value of name in restaurant:", restaurant.name);
// Shorthand
const { name, openingHours } = restaurant;
const { openingHours: { friday } } = restaurant;
//we can go further and get the value of open in friday
const { openingHours: { friday: { open } } } = restaurant;
console.log(name, friday, open);
02)、对象。 条目()
Object.entries() 是 ES8 中引入的一项功能，允许您将文本对象转换为键/值对的链表。
const credits = {
producer: "Open Replay",
editor: "Federico",
assistant: "John",
};
const arr = Object.entries(credits);
console.log(arr);
Output: [
["producer", "Open Replay"],
["editor", "Federico"],
["assistant", "John"],
];
03)、对象。 值（）
Object.values()也是ES8中引入的新特性，与Object有类似的功能。 Entry() 但这没有关键部分：
const credits = {
producer: "Open Replay",
editor: "Federico",
assistant: "John",
};
const arr = Object.values(credits);
console.log(arr);
Output: ["Open Replay", "Federico", "John"];
04)、对象循环简写
传统的 JavaScript for 循环语法是 for (let i = 0; i < x; i++) { ... }。 此循环语法可用于通过引用迭代器的字段宽度来迭代字段。 for 循环共有三种快捷方法，提供了多种方式来迭代链表中的对象：
for...of 创建一个循环外部字符串、数组和类似字段（甚至是节点列表）的对象
for...in 访问链表的索引和对象文字上的键，同时记录属性名称和值的字符串。
Array.forEach 使用回调函数对数组元素及其索引执行操作
const arr = ["Yes", "No", "Maybe"];
// Longhand
for (let i = 0; i < arr.length; i++) {
console.log("Here is item: ", arr[i]);
}
// Shorthand
for (let str of arr) {
console.log("Here is item: ", str);
}
arr.forEach((str) => {
console.log("Here is item: ", str);
});
for (let index in arr) {
console.log(`Item at index ${index} is ${arr[index]}`);
}
// For object literals
const obj = { a: 1, b: 3, c: 5 };
for (let key in obj) {
console.log(`Value at key ${key} is ${obj[key]}`);
}
05)、对象属性缩写
在 JavaScript 中定义对象文字使生活变得更加容易。 ES6 为对象分配属性提供了更多简单性。 如果变量名和对象键相同，则可以使用简写符号。
通过在对象字面量中声明变量，您可以快速为 JavaScript 中的对象分配属性。 为此，必须使用预期的键来命名变量。 当您已经拥有与对象属性同名的变量时，通常会使用此方法。
const a = 1;
const b = 2;
const c = 3;
// Longhand
const obj = {
a: a,
b: b,
c: c,
};
// Shorthand
const obj = { a, b, c };
06)、Javascript For循环
如果您想要简单的 JavaScript 并且不想依赖第三方库，这个小技巧很有用。
// Longhand:
const fruits = ['mango', 'peach', 'banana'];
for (let i = 0; i < fruits.length; i++) { /* something */ }
// Shorthand:
for (let fruit of fruits) { /* something */ }
如果您想访问文字对象中的键，这也适用：
const obj = { continent: "Africa", country: "Ghana", city: "Accra" };
for (let key in obj) console.log(key); // output: continent, country, city
07)、Array.forEach的缩写：
function logArrayElements(element, index, array) {
console.log("a[" + index + "] = " + element);
}
[2, 4, 6].forEach(logArrayElements);
// a[0] = 2
// a[1] = 4
// a[2] = 6
2. 与Javascript链表相关
01)、阵列重建
ES6 的一个有趣的新功能是重构参数。 解构是一个 JavaScript 表达式，它将链表值或对象属性分离为单独的变量。 换句话说，我们可以通过从链表和对象中提取数据来将数据分配给变量。
const arr = [2, 3, 4];
// Longhand
const a = arr[0];
const b = arr[1];
const c = arr[2];
// Shorthand
const [a, b, c] = arr;
02)、价差运算符
得益于 ES6 中引入的扩展运算符，JavaScript 代码变得更加高效且易于使用。 它可以替代特定的链表函数。 扩展运算符中有一系列的三个点，我们可以使用它们来连接和克隆链表。
const odd = [3, 5, 7];
const arr = [1, 2, 3, 4];
// Longhand
const nums = [2, 4, 6].concat(odd);
const arr2 = arr.slice();
// Shorthand
const nums = [2, 4, 6, ...odd];
const arr2 = [...arr];
与 concat() 函数不同，您可以使用增广运算符将一个链表插入到另一个链表的任意位置。
const odd = [3, 5, 7];
const nums = [2, ...odd, 4, 6]; // 2 3 5 7 4 6
3. 与Javascript字符串相关
01)、多行字符串
如果您发现自己需要在代码中编写多行字符串，您可以执行以下操作：
// Longhand
const lorem =
"Lorem, ipsum dolor sit amet" +
"consectetur adipisicing elit." +
" Quod eaque sint voluptatem aspernatur provident" +
"facere a dolorem consectetur illo reiciendis autem" +
"culpa eos itaque maxime quis iusto quisquam" +
"deserunt similique, dolores dolor repudiandae!" +
"Eaque, facere? Unde architecto ratione minus eaque" +
"accusamus, accusantium facere, sunt" +
"quia ex dolorem fuga, laboriosam atque.";
不过还有更简单的方法，只需要使用后冒号就可以完成。
// Shorthand:
const lorem = `Lorem, ipsum dolor sit amet
consectetur adipisicing elit.
Quod eaque sint voluptatem aspernatur provident
facere a dolorem consectetur illo reiciendis autem
culpa eos itaque maxime quis iusto quisquam
deserunt similique, dolores dolor repudiandae!
Eaque, facere? Unde architecto ratione minus eaque
accusamus, accusantium facere, sunt
quia ex dolorem fuga, laboriosam atque.`;
02)、将字符串转换为数字
有时，您的代码可能会收到字符串格式的数据，而这些数据必须以数字格式进行处理。 这不是什么大问题； 我们可以快速转换它。
// Longhand
const num1 = parseInt('1000');
const num2 = parseFloat('1000.01')
// Shorthand
const num1 = +'1000'; //converts to int datatype
const num2 = +'1000.01'; //converts to float data type
03)、模板文本
我们可以在不使用 (+) 的情况下将许多变量附加到字符串中。 模板文字在这里派上用场。 用后冒号包裹字符串，用 ${ } 包裹变量，以利用模板文字。
const fullName = "Ama Johnson";
const job = "teacher";
const birthYear = 2000;
const year = 2025;
// Longhand
const Fullstr =
"I am " + fullName + ", a " + (year - birthYear) + " years old " + job + ".";
// Shorthand
const Fullstr = `I am ${fullName}, a ${year - birthYear} years old ${job}. `;
模板文字为我们省去了很多用 + 运算符连接字符串的麻烦。
4、与指数相关
01)、指数幂简写
第一个操作数除以第二个操作数的幂的结果是求幂运算符 ** 返回的结果。 它与 Math.pow 相同，只是 BigInt 也被接受作为操作数。
// Longhand
Math.pow(2, 3); //8
Math.pow(2, 2); //4
Math.pow(4, 3); //64
// Shorthand
2 ** 3; //8
2 ** 4; //4
4 ** 3; //64
02), 十进制基数索引
这个可能以前见过。 本质上，这是一种编写没有最后零的整数的独特方法。 例如，表达式 1e8 表示 1 后跟八个零。 它表示十进制基数 100,000,000，JavaScript 将其解释为浮点类型。
// Longhand
for (let i = 0; i < 10000000; i++) { /* something */ }
// Shorthand
for (let i = 0; i < 1e7; i++) { /* something */ }
// All the below will evaluate to true
1e0 === 1;
1e1 === 10;
1e2 === 100;
1e3 === 1000;
1e4 === 10000;
1e5 === 100000;
1e6 === 1000000;
1e7 === 10000000;
1e8 === 100000000;
5. JavaScript其他操作的简写
01)、短路评估
短路评估还可以替代 if...else 子句。 此快捷方法使用逻辑 OR 运算符 || 当变量的预期值为 false 时，为变量提供默认值。
let str = "";
let finalStr;
// Longhand
if (str !== null && str !== undefined && str != "") {
finalStr = str;
} else {
finalStr = "default string";
}
// Shorthand
let finalStr = str || "default string"; // 'default string'
02)、默认参数
if语句用于定义函数参数的默认值。 在 ES6 中，您可以在函数声明本身中定义默认值。 默认函数参数允许在未传递值或未定义的情况下使用默认值初始化参数。
以前都是在函数体内测试参数值，如果没有定义，就是形参。
默认情况下，JavaScript 中的函数参数是未定义的。 然而，设置不同的默认设置通常是有利的。 在这里，默认设置可能很有用。
// Longhand
function volume(a, b, c) {
if (b === undefined) b = 3;
if (c === undefined) c = 4;
return a * b * c;
}
// Shorthand
function volume(a, b = 3, c = 4) {
return a * b * c;
}
03)、隐式返回函数
我们经常使用关键字 return 来表示函数的最终输出。 单句箭头函数将隐式返回其计算结果（该函数必须省略方括号 {} 才能执行此操作）。
对于多行句子javascript 数字格式，例如表达式，我们可以将返回表达式括在括号（）中。
function capitalize(name) {
return name.toUpperCase();
}
function add(numG, numH) {
return numG + numH;
}
// Shorthand
const capitalize = (name) => name.toUpperCase();
const add = (numG, numH) => numG + numH;
// Shorthand TypeScript (specifying variable type)
const capitalize = (name: string) => name.toUpperCase();
const add = (numG: number, numH: number) => numG + numH;
发表评论