【相关学习推荐:javascript视频教程】
废话不多话,在本文中,列出了一些比较常用或者实用的的 JavaScript 代码片段,希望对你们有所帮助。
1.三元运算符
let someThingTrue = trueif(someThingTrue){ handleTrue()}else{ handleFalse()}****** 以下是简短版本 ******let someThingTrue = truesomeThingTrue ? handleTrue() : handleFalse()复制代码
登录后复制
2.短路或运算
const defaultValue = "SomeDefaultValue"let someValueNotSureOfItsExistance = nulllet expectingSomeValue = someValueNotSureOfItsExistance || defaultValueconsole.log(expectingSomeValue) // SomeDefaultValue复制代码
登录后复制
3. 条件成立
let someValue = trueif (someValue) { console.log('条件成立!')}复制代码
登录后复制
4. for 循环
for (let i = 0; i < 1e2; i++) { // 代替 i<100 是不是有点酷}复制代码
登录后复制
let someValues = [1, 2, 4]for (let val in someValues) { console.log(val)}let obj = { 'key1': 'value1', 'key2': 'value2', 'key3': 'value3'}for (let key in obj) { console.log(key)}复制代码
登录后复制
5. 值到对象的映射
let x='x',y='y'let obj = {x,y}console.log(obj) // {x: "x", y: "y"}复制代码
登录后复制
6. Object.entries()
const credits = { producer: '大迁世界', name: '前端小智', rating: 9}const arr = Object.entries(credits)console.log(arr)*** 输出 ***[ [ 'producer', '大迁世界' ], [ 'name', '前端小智' ], [ 'rating', 9 ] ]复制代码
登录后复制
7. Object.values()
const credits = { producer: '大迁世界', name: '前端小智', rating: 9}const arr = Object.values(credits)console.log(arr)*** 输出 ***[ '大迁世界', '前端小智', 9 ]复制代码
登录后复制
8. 模板字面量
let name = '前端小智'let age = 20var someStringConcatenateSomeVariable = `我是 ${name},今年 ${age} 岁`console.log(someStringConcatenateSomeVariable)复制代码
登录后复制
9. 解构赋值
import { observable, action, runInAction } from 'mobx';复制代码
登录后复制
10.多行字符串
let multiLineString = `some stringwith multi-line ofcharacters`console.log(multiLineString)复制代码
登录后复制
11.Array.find 简写
const pets = [{ type: 'Dog', name: 'Max' }, { type: 'Cat', name: 'Karl' }, { type: 'Dog', name: 'Tommy' }]pet = pets.find(pet => pet.type === 'Dog' && pet.name === 'Tommy')console.log(pet) // { type: 'Dog', name: 'Tommy' }复制代码
登录后复制
12.默认参数值
早期的做法
function area(h, w) { if (!h) { h = 1; } if (!w) { w = 1; } return h * w}复制代码
登录后复制
ES6 以后的做法
function area(h = 1, w = 1) { return h * w}复制代码
登录后复制
13.箭头函数的简写
let sayHello = (name) => { return `你好,${name}`}console.log(sayHello('前端小智'))复制代码
登录后复制
简写如下:
立即学习“Java免费学习笔记(深入)”;
let sayHello = name => `你好,${name}`console.log(sayHello('前端小智'))复制代码
登录后复制
14.隐式返回
let someFuncThatReturnSomeValue = (value) => { return value + value}console.log(someFuncThatReturnSomeValue('前端小智'))复制代码
登录后复制
简写如下:
立即学习“Java免费学习笔记(深入)”;
let someFuncThatReturnSomeValue = (value) => ( value + value)console.log(someFuncThatReturnSomeValue('前端小智'))复制代码
登录后复制
15.函数必须有参数值
function mustHavePatamMethod(param) { if (param === undefined) { throw new Error('Hey You must Put some param!'); } return param;}复制代码
登录后复制
以像这样重写:
mustHaveCheck = () => { throw new Error('Missing parameter!')}methodShoudHaveParam = (param = mustHaveCheck()) => { return param}复制代码
登录后复制
16.charAt() 简写
'SampleString'.charAt(0) // S// 简写'SampleString'[0]复制代码
登录后复制
17.有条件的函数调用
function fn1() { console.log('I am Function 1')}function fn2() { console.log('I am Function 2')}/*长的写法*/let checkValue = 3;if (checkValue === 3) { fn1()} else { fn2()}复制代码
登录后复制
简短的写法:
(checkValue === 3 ? fn1 : fn2)()复制代码
登录后复制
17.Math.Floor 简写
let val = '123.95'console.log(Math.floor(val)) // 常规写法console.log(~~val) // 简写复制代码
登录后复制
18.Math.pow 简写
Math.pow(2, 3) // 8// 简写2 ** 3 // 8复制代码
登录后复制
19.将字符串转换为数字
const num1 = parseInt('100')// 简写console.log(+"100")console.log(+"100.2")复制代码
登录后复制
20.&& 运算
let value = 1;if (value === 1) console.log('Value is one')//OR In short value && console.log('Value is one')复制代码
登录后复制
21.toString 简写
let someNumber = 123console.log(someNumber.toString()) // "123"// 简写console.log(`${someNumber}`) // "123"复制代码
登录后复制
22.可选的链运算符(即将发布
以上就是2021高频实用的 JavaScript 片段的详细内容,更多请关注【创想鸟】其它相关文章!
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。
发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2725912.html