英文 | https://medium.com/geekculture/12-javascript-pro-snippet-codes-for-everyday-problems-678d510b28de
翻译 | 杨小爱
在这篇文章中,我将分享 12 个 JavaScript 代码片段,以解决您的日常开发问题。这将是您可以在 JavaScript 项目中自由使用的工具箱。
1、智能数据过滤
使用 JavaScript 内置的 Filter 方法过滤您的数据。当您有大量数组形式的数据并希望从中过滤一些元素时,这会派上用场。
// Data Filteration
var data = ["Football", "Soccer", "Cricket", "Basketball", "Hockey"]
var filtered_data = data.filter(data => data.length < 8)
console.log(filtered_data)
// ["Soccer", "Cricket", "Hockey"]
2、 循环键和值
另一个有用的代码片段,用于迭代数据的键和值。我们将使用 forEach 方法来完成这个任务。
// looping throught objectslet
data = {JavaScript: 1, Dart: 2, Java: 3};Object.keys(data).forEach((key, value) => { console.log(key, value); });
// Output
// JavaScript 0
// Dart 1
// Java 2
3、解构赋值
您可以使用解构方法解压缩数组值并将它们分配给其他变量。 查看下面的示例代码。
// Destructive Assignment
let data = ["Haider", "22", "50000", "Web Developer"]
let [name, age, salary, profession] = data
console.log(name, age, salary, profession)
// Haider 22 50000 Web Developer
4、分割数组
这是另一个有用的片段代码,它将在不使用任何循环的情况下对您的数组进行切片。 slice 的语法是 slice(startIndex, endIndex)。
// Slicing An Array
let array = [10, 12, 13, 14, 15, 16]
console.log(array.slice(0, 3))
// [10, 12, 13]
console.log(array.slice(0, 2))
// [10, 12]
5、在数组中搜索对象
您可以使用 JavaScript find() 方法在 Array 中搜索对象。 下面是一个片段代码示例。
// Search Object in Array
let data = [
{name:"haider", Salary:60000},
{name:"John", Salary:50000},
{name:"Peter", Salary:20000},
]
let emp = data.find(data => data.name === "Peter")
console.log(emp)
// Output
{
name:"Peter",
Salary:20000
}
6、反转字符串
这段代码将向您展示如何在不使用循环的情况下反转字符串。
// String Reverse
var reverse = (data) => {return data.split("").reverse().join(""); }
console.log(reverse("CoderBoy")) // yoBredoC
console.log(reverse("Medium")) // muideM
7、连接列表
现在您不需要使用函数和循环将多个列表合并为一个。 您可以使用 JavaScript内置的 Concat() 方法。
查看下面的代码示例。
let arr1 = [10, 20, 30]
let arr2 = [40, 50]
var arr = arr1.concat(arr2)console.log(arr)
// [10, 20, 30, 40, 50]
8、捕获右键单击
这个简单的片段代码将捕获 Web 浏览器中鼠标的右键单击。
// Capture Right Click
window.oncontextmenu = () => {console.log("Right Click is Pressed!")}
9、内置排序
排序是每种编程语言的常见问题。 在 JavaScript 中,您可以使用 sort() 方法对任何元素列表进行排序。
// Built in Sorting
var num = [9, 8, 4, 2, 8, 0, 3, 8]
num.sort()
console.log(num) //[0, 2, 3, 4, 8, 8, 9]
10、处理JS中的错误
在编程中,错误总是令人头疼的。 要处理 JavaScript 中的错误,您可以使用 try/catch 语句。 查看以下语法:
// Error Handling
try {
// Code Block to try
}
catch(err) {
// Code Block to handle errors
}
finally {
// Code Block to be executed regardless of the try and catch results
}
11、查找数组元素的索引
现在你不需要遍历整个 Array 来找到任何元素的索引。 查看下面的代码片段,让您的生活更轻松。
// Index of Element
var num = [9, 8, 4, 2, 8, 0, 3, 8]
console.log(num.indexOf(9))
// 0
console.log(num.indexOf(3))
// 6
console.log(num.indexOf(8))
// 1
12、检查字符串是否为大写
这是一个简单的片段,可帮助您检查字符串是大写还是小写。
// Check for UpperCase
const CheckUpper = string => string === string.toUpperCase();
console.log(CheckUpper("Hello"))
// false
console.log(CheckUpper("LEARN"))
// true
最后的想法
内容就到这里了,我希望你觉得这篇文章对您有帮助并且读起来很有趣。 请在留言区随时分享您的留言,也不要忘记与您身边的开发者朋友分享它。
祝您快乐编程!