https://github.com/lbb00/use-singleton
Create the singleton easily by javascript.
https://github.com/lbb00/use-singleton
npm-package singleton typescript
Last synced: 25 days ago
JSON representation
Create the singleton easily by javascript.
- Host: GitHub
- URL: https://github.com/lbb00/use-singleton
- Owner: lbb00
- License: mit
- Created: 2021-07-05T18:51:56.000Z (over 4 years ago)
- Default Branch: master
- Last Pushed: 2023-12-18T11:50:33.000Z (over 2 years ago)
- Last Synced: 2025-10-21T16:56:30.586Z (5 months ago)
- Topics: npm-package, singleton, typescript
- Language: TypeScript
- Homepage:
- Size: 106 KB
- Stars: 3
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# use-singleton
[](https://www.npmjs.com/package/use-singleton)
[](https://bundlephobia.com/result?p=use-singleton)
[](https://codecov.io/gh/lbb00/use-singleton)
[](https://github.com/lbb00/use-singleton/blob/master/LICENSE)
[](https://www.npmjs.com/package/use-singleton)
[](https://snyk.io/test/github/lbb00/use-singleton)
> Create the powerful singleton easily.
- Lazy or Immediately
- Refresh
- Cache value with key
- Clean value and cache
- Support cjs, ejs, umd
- Typescript
- Zero dependence
- Side-effect free
- Only ~.5kb after gzipped
## Install
### NPM
```bash
npm install use-singleton --save
```
### Browser
```html
var useSingle = UseSingleton.useSingle;
var useSingleton = UseSingleton.useSingleton;
// es2015+
import { useSingle } from "https://esm.sh/use-singleton";
```
## Usage
```javascript
import { useSingleton, useSingle } from "use-singleton";
// the simple
const [getter, setter] = useSingle(initialValue);
// the powerful
const getSingleton = useSingleton(createInstance, options);
```
## Example
### useSingle
```javascript
const [getCount, setCount] = useSingle(0);
getCount(); // -> 0
setCount(1);
getCount(1); // -> 1
// vue
const [getCount, setCount] = useSingle(ref(0));
watch(getCount, (val) => console.log(val));
setCount(1);
// log -> 1
getCount().value; // -> 1
```
### useSingleton
#### Lazy
```javascript
const getNumber = useSingleton(() => {
console.log("created");
return 1;
});
getNumber();
// log -> 'created'
// -> 1
getNumber(); // -> 1
```
#### Immediately
```javascript
const getNumber = useSingleton(
() => {
console.log("created");
return 1;
},
{
immediately: true,
}
);
// log -> 'created'
getNumber();
// -> 1
```
#### Async
```javascript
const getServerInfo = useSingleton(
() => {
console.log('fetch data')
return await api.get(`https://foo.bar/api/server-info`)
}
);
await getServerKey()
// log -> 'fetch data'
// -> server-info
await getServerKey()
// -> server-info
await getServerKey(null,{ refresh: true})
// log -> 'fetch data'
// -> server-info_new
await getServerKey()
// -> server-info_new
```
#### With key
```javascript
const getUserInfo = useSingleton(
async (key) => {
const userId = key;
console.log(`fetch user info: ${userId}`);
userInfo = await api.get(`https://foo.bar/api/user?id=${userId}`);
return userInfo;
},
{
withKey: true,
}
);
await Promise.all[(getUserInfo(1), getUserInfo(1), getUserInfo(2))];
// log -> 'fetch user info: 1'
// log -> 'fetch user info: 2'
// -> [userInfo_1, userInfo_1, userInfo_2]
await getUserInfo(1);
// log -> 'fetch user info: 1'
// -> userInfo_1
```
#### Key cache
> To use the key cache, `withKey` must be set to `true`.
```javascript
const getUserInfo = useSingleton(
async (key) => {
const userId = key;
console.log(`fetch user info: ${userId}`);
userInfo = await api.get(`https://foo.bar/api/user?id=${userId}`);
return userInfo;
},
{
withKey: true,
keyCache: true,
}
);
await Promise.all[(getUserInfo(1), getUserInfo(1), getUserInfo(2))];
// log -> 'fetch user info: 1'
// log -> 'fetch user info: 2'
// -> [userInfo_1, userInfo_1, userInfo_2]
await getUserInfo(1);
// form cache -> userInfo_1
await getUserInfo(1, { refresh: false });
// log -> 'fetch user info: 1'
// -> userInfo_1
```
#### Clean value and cache
```javascript
const getUserInfo = useSingleton(
async (key) => {
const userId = key;
console.log(`fetch user info: ${userId}`);
userInfo = await api.get(`https://foo.bar/api/user?id=${userId}`);
return userInfo;
},
{
withKey: true,
keyCache: true,
}
);
await Promise.all[(getUserInfo(1), getUserInfo(1), getUserInfo(2))];
// log -> 'fetch user info: 1'
// log -> 'fetch user info: 2'
// -> [userInfo_1, userInfo_1, userInfo_2]
await getUserInfo(1);
// form cache -> userInfo_1
await getUserInfo(1, { clean: true });
// form cache -> userInfo_1
await getUserInfo(1);
// log -> 'fetch user info: 1'
// -> userInfo_1
```