const test = ({ foo = 'foo', bar = 'bar' } = {}) => {
return { foo, bar };
};
test(); // { foo: 'foo', bar: 'bar' }
test({}); // { foo: 'foo', bar: 'bar' }
test({ foo: 'cat' }); // { foo: 'cat', bar: 'bar' }
But if i rewrite it in TS
const test = ({
foo = 'foo',
bar = 'bar',
}: { foo: string; bar: string } = {}) => {
return { foo, bar };
};
= {} will cause error because of type mismatch (but as we see in first example — there is no undefined params and should be no type mismatch).
How to rewrite JS example in TS properly?
try this in your ts file :
const test = ({
foo = 'foo',
bar = 'bar',
}: { foo?: string; bar?: string } = {}) => {
return { foo, bar };
};
Related
so basically I want to use createNode() within the callback of the file.walk() command, but when I do that, no nodes are created and you can't query the component type in graphiQL.
Uncommenting the other and commenting out the file section allows me to query the component (since it isn't in the callback.)
// Gatsby Node File
const file = require('file');
exports.sourceNodes = async ({ actions, createNodeId, createContentDigest }) => {
const { createNode } = actions;
// const components = [{
// key: 123,
// foo: `ywgavevw`,
// bar: `Baz`
// },
// {
// key: 456,
// foo: 'asdfsadf',
// bar: 'asdfasdf'
// }];
file.walk('./components/', (_, some, thing, files) => {
console.log(files);
let component = {
key: 456,
foo: 'asdfsadf',
bar: 'asdfasdf'
}
const nodeContent = JSON.stringify(component);
const nodeMeta = {
id: createNodeId(`kstat-component-${component.key}`),
parent: null,
children: [],
internal: {
type: `KstatComponent`,
mediaType: `text/html`,
content: nodeContent,
contentDigest: createContentDigest(component)
}
}
const node = Object.assign({}, component, nodeMeta);
createNode(node);
});
// components.forEach((component) => {
// const nodeContent = JSON.stringify(component);
// const nodeMeta = {
// id: createNodeId(`kstat-component-${component.key}`),
// parent: null,
// children: [],
// internal: {
// type: `KstatComponent`,
// mediaType: `text/html`,
// content: nodeContent,
// contentDigest: createContentDigest(component)
// }
// }
// const node = Object.assign({}, component, nodeMeta);
// createNode(node);
// });
}
On a higher level, I am trying to achieve creating a number of nodes based on files in the filesystem. Is there a less-crazy way of doing this? Should I consider something else? Thanks!
Have you tried awaiting for the callback?
await file.walk('./components/', (_, some, thing, files) => {
console.log(files);
let component = {
key: 456,
foo: 'asdfsadf',
bar: 'asdfasdf'
}
const nodeContent = JSON.stringify(component);
const nodeMeta = {
id: createNodeId(`kstat-component-${component.key}`),
parent: null,
children: [],
internal: {
type: `KstatComponent`,
mediaType: `text/html`,
content: nodeContent,
contentDigest: createContentDigest(component)
}
}
const node = Object.assign({}, component, nodeMeta);
createNode(node);
});
I can defined readFoo in Foo class:
var myFormat = 'foo'
class Foo {
[ "read" + ((format) => format)(myFormat) ]() {
return 123;
}
}
is there any way how to define function base on config like:
var config = ['foo1', 'foo2']
class Foo {
config.map((name) => {
[ "read" + ((format) => format)(name) ]() {
return 123;
}
}
}
Will create functions readFoo1 and readFoo2.
You can iterate through the array and assign to the prototype afterwards:
var config = ['foo1', 'foo2']
class Foo {}
for (const name of config) {
Foo.prototype["read" + name] = function() {
return 123;
};
}
const f = new Foo();
console.log(f.readfoo1());
How can i access to data values inside itself in vue.js?
Code:
data: function(){
return {
foo: 123,
bar: this.foo
}
}
In this case I got undefined
There are several options I see:
data: function(){
const data = {
foo: 123
};
data.bar = data.foo;
return data;
}
or
data: function(){
const data = {
foo: 123
};
return {
...data,
bar: data.foo
};
}
You've got undefined because of this.foo refers to function(){`s context, not object`s context.
Using jscodeshift, how can I transform
// Some code ...
const someObj = {
x: {
foo: 3
}
};
// Some more code ...
to
// Some code ...
const someObj = {
x: {
foo: 4,
bar: '5'
}
};
// Some more code ...
?
I have tried
module.exports = function(file, api, options) {
const j = api.jscodeshift;
const root = j(file.source);
return root
.find(j.Identifier)
.filter(path => (
path.node.name === 'someObj'
))
.replaceWith(JSON.stringify({foo: 4, bar: '5'}))
.toSource();
}
but I just end up with
// Some code ...
const someObj = {
{"foo": 4, "bar": "5"}: {
foo: 3
}
};
// Some more code ...
which suggests that replaceWith just changes the key instead of the value.
You have to search for the ObjectExpression rather than for the Identifier:
module.exports = function(file, api, options) {
const j = api.jscodeshift;
const root = j(file.source);
j(root.find(j.ObjectExpression).at(0).get())
.replaceWith(JSON.stringify({
foo: 4,
bar: '5'
}));
return root.toSource();
}
Demo
I have something like this:
var yourNamespace = {
foo: function() {
.....
},
bar: function() {
function foobar() {....
}
}
};
Is there a possibility to call inside of foo, the foobar function inside of bar?
With your exact structure you cannot however you can do something like that :
var yourNamespace = {
foo: function() {
.....
yourNamespace.foobar()
},
bar: function() {
function foobar() {....}
yourNamespace.foobar = foobar;
}
};
Or nicer, (IMO) :
var yourNamespace = {
foo: function() {
.....
yourNamespace.bar.foobar()
},
bar: function() {
yourNamespace.bar.foobar = function() {....}
}
};
Please note: in both case, bar() must run before foo() otherwise foobar is undefined
This is just a simple Module pattern. What you should do is make bar it's own module, and return foobar from that module. Example:
var yourNamespace = {
foo: function() {
this.bar.foobar();
},
bar: {
abc: '',
foobar: function() {
console.log('do something');
}
}
};
Or you could do something more like this:
var yourNamespace = {
foo: function() {
var bar = this.bar();
},
bar: function() {
var abc = '';
function foobar() {
console.log('return abc or do something else');
return abc;
}
return {
foobar: foobar
}
}
};