A small feature library that makes it easier to manipulate objectsjavascript
It is tiny but very useful and can help you handle javascript native objects. Data-driven interface development is very common today, we are in the angular, react, vue will encounter a lot of object processing, including set the default value, query, assignment, etc., jscalpel is born for this scene.html
jscalpel is little poor, gzip less than 3k, so a library you can use it anytime, anywhere without worrying about anything.vue
中文文檔html5
npm install jscalpel --save
yarn add jscalpel --save
複製代碼
import Jscalpel from 'jscalpel'
複製代碼
<script charset="utf-8" src="https://unpkg.com/jscalpel@latest/dist/index.js"></script>
複製代碼
parameter | type | default value | use | isRequired | required version |
---|---|---|---|---|---|
target | string/object | {} | target | true | all |
deep | boolean | false | whether or not to copy the target object in depth | false | all |
prefix | string | undefined | public prefix, automatically added for the keys | false | all |
success | function | function () {} | The function that was called when the analysis was successful | true | ^0.6.2 |
error | function | function () {} | The function that is called when the analysis fails. | false | ^0.6.2 |
path | string/array/function | [] | path | false | ^0.6.2 |
plugins | array | [] | A plug-in set, similar to the webpack plugins. | false | ^0.6.2 |
// mock data
var data = {
status: '0',
data: {
response: {
code: 1,
msg: 'response msg'
}
}
}
// super easy
jscalpel.get(data, 'data.response.code'); // return 1
// bind data
var jscalpelIns = jscalpel({
target: data
})
jscalpelIns.get('data.response.code') // returned 1;
jscalpelIns.set('data.response.code', 12);
jscalpelIns.set({
'status': '1'
})
jscalpelIns.get('data.response.code') // returned 12
jscalpelIns.get('status') // returned 1
jscalpelIns.has('data.response.code') // returned true
jscalpelIns.del('data.reponse.code')
jscalpelIns.get('data.reponse.code') // returned undefined;
jscalpelIns.has('data.reponse.code') // returned false;
複製代碼
const res = {
data: {
article: [{
articleId: 0,
title: 'jscalpel'
}]
},
response: {
code: '0',
msg: 'success'
}
}
jscalpel({
target: res,
path: ['data.article.0', 'response.msg'],
success: (article, msg) => {
console.log('keys=>array=>output:', article, msg);
}
})
jscalpel({
target: res,
path: 'response.msg',
success: (msg) => {
console.log('keys=>string=>output:',msg);
}
});
複製代碼
jscalpel({
target: res,
prefix: 'response',
path: ['code', 'msg'],
success: (code, msg) => {
console.log('prefix=>output:', code, msg);
}
})
複製代碼
jscalpel({
target: res,
path: () => ['code', 'msg'].map((key) => `response.${key}`),
success: (code, msg) => {
console.log('dynamic=>output:', code, msg);
}
})
jscalpel({
target: res,
deep: true,
prefix: 'response',
path: ['code', 'msg'],
success: (code, msg, finalRes, keys) => {
console.log( finalRes === res);
console.log('deep into callback:', code, msg, finalRes, keys);
}
});
複製代碼
const logicMap = {
'code': {
match: ({value, name}) => value === '0',
success: ({value, name}) => {
console.log('logicPlugin', value, name);
}
}
}
jscalpel({
target: res,
deep: true,
prefix: 'response',
path: ['code', 'msg'],
plugins: [jscalpel.jscalpelType, jscalpel.jscalpelLogic(logicMap)],
success: (code, msg, finalRes, keys) => {
console.log( finalRes === res);
console.log('deep into callback:', code, msg, finalRes, keys);
}
})
複製代碼
jscalpel-ormjava
It is convenient for you to extract the required fields from one object to generate another object.node
Add jscalpelLogic plugin, reduce ifelse, make run logic configurablereact
add ormwebpack
add get methodgit
import { get } from 'jscalpel';
// get(data, path ,defaultValue);
複製代碼
The MIT License.github