A small feature library that makes it easier to manipulate objects
Overview
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.
jscalpel is little poor, gzip less than 3k, so a library you can use it anytime, anywhere without worrying about anything.
Document
View the document please visit https://ihtml5.github.io/jscalpel/
Installation
Install using npm
npm install jscalpel --save
yarn add jscalpel --save
Useage
Es6
import Jscalpel from 'jscalpel'
Include in html
<script charset="utf-8" src="https://unpkg.com/jscalpel@latest/dist/index.js"></script>
APIS
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 |
Online Demos
Code
1. simple pattern
// mock data
var data = {
status: '0',
data: {
response: {
code: 1,
msg: 'response msg'
}
}
}
// 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;
2.advanced patterns
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);
}
});
3.use prefix
jscalpel({
target: res,
prefix: 'response',
path: ['code', 'msg'],
success: (code, msg) => {
console.log('prefix=>output:', code, msg);
}
})
4.dynamic path
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);
}
});
5.use plugins
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);
}
})
Related projects
It is convenient for you to extract the required fields from one object to generate another object.
Changelog
2017.9.14
Add jscalpelLogic plugin, reduce ifelse, make run logic configurable
2018.3.08
add orm
Top comments (0)