How is svelte making a component dirty - javascript

The snippet below is what gets generated when we do a npm run dev on svelte app.
function make_dirty(component, i) {
if (component.$$.dirty[0] === -1) {
dirty_components.push(component);
schedule_update();
component.$$.dirty.fill(0);
}
component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
}
Can anybody please explain what is happening with the statement below? Why is the number 31 hard-coded?
component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
Thanks

To expand a bit on Tijmen's answer, I'll try and explain some of the rationale for this code as well as what it's actually doing.
A bitmask is a technique for storing multiple boolean options in a single integer. Say you have options A, B, C and D — you assign the values 1, 2, 4 and 8 to them, and then you can store any combination of those options like so:
AB — 3
BD — 10
ACD — 13
Later, you can retrieve the value using bitwise operators:
if (opts & 1) console.log('A was selected');
if (opts & 2) console.log('B was selected');
if (opts & 4) console.log('C was selected');
if (opts & 8) console.log('D was selected');
Svelte uses bitmasks to track which values are dirty, i.e. what has changed since the component was last updated. Because of the 31 bit limit Tijmen described, a single bitmask would only let us have 31 variables in a component — plenty in most circumstances, but certainly not all. So component.$$.dirty is an array of bitmasks.
This line of code...
component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31));
...dirties the correct bit of the correct bitmask — the (i / 31) | 0 gives us the index of the bitmask, (1 << (i % 31)) gives us the value of the bit within that bitmask, and |= sets the bit to 1, whatever its value was before.
The -1 is used as a sentinel value for indicating that the component wasn't previously dirty at all, so that Svelte can add it to the list of components that need to be updated in the next tick.

The dirty array is an array that stores multiple Boolean variables in an integer, also know as a bit array.
Integers in JavaScript are, by default, signed and 32-bit. The reason it only stores 31 bits per integer instead of 32 that because it's signed, the last bit, if set, makes the integer represent a negative number. I'm missing some context, but looking at the first if-statement, the code seems to reserve negative numbers for special cases.

Related

JS function that creates a range of numbers (inclusive beginning and end) with a limit on range items

You are given a starting number and ending number and the max number of output elements allowed. How would you create an output array with as even a distribution as possible, while still including the first and last points in the output?
Function signature
function generatePoints(startingNumber, endingNumber, maxPoints) {}
Function desired output
generatePoints(0, 8, 5) // [0, 2, 4, 6, 8]
Here's what I tried so far
function generatePoints(startingNumber, endingNumber, maxPoints) {
const interval = Math.round((endingNumber - startingNumber) / maxPoints)
let count = 0
let counter = 0
let points = []
while(count < maxPoints - 1) {
points.push(counter)
counter+=interval
count++
}
points.push(endingNumber)
return points
}
Technically this creates the correct output for the simple case, but falls short when up against most other edge cases due to the fact that I'm stopping one iteration early and then adding the final point. I'm thinking that the better way to do this (to create a better distribution) is to build from the center of the array outwards, versus building from the start of the array and then stopping one element early and appending the endingNumber.
Note this:
0 2 4 6 8
+-----+ +-----+ +-----+ +-----+
A B C D
Splitting our range into intervals with 5 points including the endpoints, we have only four intervals. It will always be one fewer than the number of points. We can divide our range up evenly into these smaller ranges, simply by continually adding the width of one interval, which is just (endingNumber - startingNumber) / (maxPoints - 1). We can do it like this:
const generatePoints = (startingNumber, endingNumber, maxPoints) => Array .from (
{length: maxPoints},
(_, i) => startingNumber + i * (endingNumber - startingNumber) / (maxPoints - 1)
)
console .log (generatePoints (0, 8, 5))
We just build an array of the right length, using the index parameter to count the number of smaller intervals we're using.
We do no error-checking here, and if maxPoints were just 1, we might have an issue. But that's easy enough to handle how you like.
But there is a concern here. Why is the parameter called maxPoints instead of points? If the number of points allowed is variable, I think we need further requirements.
Do not Math.round(interval). Instead Math.round(counter) at that last moment.
The reason why is that if you've added k intervals, the error in what you're going can be as much as 0.5*k. But if you round at the last minute, the error is never more than 0.5.

jQuery if sentence on variable odd number [duplicate]

This question already has answers here:
Testing whether a value is odd or even
(23 answers)
Closed 6 years ago.
I have a function that I want to run every time my counter is 1, 3, 5 or 7. I am confused about what the right syntax is for jQuery in this situation.
My try so far:
if (i == (0, 2, 4, 6)) {
This is one of the many versions that I have tried, and failed with.
What is the right syntax, both for every odd number, as well as a specific collection of numbers, for example '3, 12, 512, 2231'?
use the modulus operator in which the value %2 will either give a 0 or a 1 depending on the value:
if (i % 2 == 1) { // code for odd event
or do it for evens:
if (i % 2 == 0) { // code for even event
What this does is divide the value by the number given (in this case 2) and returns the remainder. So if i is 5, dividing it by two will leave a remainder of 1, so its n odd number. If i = 44, dividing by two will leave a remainder of 0, so its even.
if(i % 2 == 1) //odd number
It's a modulo operator. See this documentation for more information on JavaScript arithmetic operators.
Explained in this thread.
if(i % 2) {
// If Odd then do this
}
Is this not what you're after?
i % 2 will return 1 when an odd number and 0 when an even number.

JS Minification / Closure Compiler changes numbers from base 10 to something else?

I'm running some JS through googles closure compiler and noticed something about how it handles numbers. It seems that they are converted into something other than base 10 and I can't figure out what it is.
javascript:(function(){
var x = 30000;
console.log(x);
})();
Results in:
(function(){console.log(3E4)})();
How is 3E4 == 30000?
It's callled Scientific notation, especially the "E notation" part is what you're after.
Basically, aEb === a * Math.pow(10, b) (though this would be a syntax error - a and b have to be literals, b even has to be an integer).
3 * Math.pow(10, 4) === 30000; // true
The 3 and 4 are just in base 10. This has little to do with bases in fact.
The 3e4 is the same as "saying" 3 multiplied by 4 orders of magnitude, or a 3 with 4 zeros.

If a language has no "bit to bit" comparison, how do I simulate it?

I'm trying to make a script in the (beta) Trackmania 2 game.
(It's an ugly kindof mix between JavaScript, HTML, C, and... other stuff I couldn't imagine in my worst nightmare).
The scripting engine doesn't seem to know the "and" or "&&" (if I try myVar && 16 the nice error raised is "boolean operation awaits a boolean")
I'd like to do something like:
if (Var && 1) {
// Bit North => trace north
}
if (Var && 2) {
// Bit East => trace east
}
if (Var && 4) {
// Bit South => trace south
}
if (Var && 8) {
// Bit West => trace West
}
Any idea how I could do this if the compiler doesn't know bitfield operations?
"Bitwise and" is usually &, not &&. (&& is usually a "logical and".) "Bitwise and" is & in C and JavaScript, two languages you mentioned. In fact, && appears to be "logical and" bassd on the error message you got. The solution might simply be to use
if (Var & 1)
If you really don't have bitwise ops, it can still be done. Keep in mind that a 4 bit number can be expressed as:
b3 * 2**3 + b2 * 2**2 + b1 * 2**1 + b0 * 2**0
If you have exponentiation, division, integer truncation and modulus, you could use the following to see if to find out if bit x is set:
int( i / (2**x) ) % 2
If you don't have exponentiation, it can be replaced with a lookup table.
If you don't have modulus, i % 2 can be replaced with ( (i/2) - int(i/2) )*2

Is there a better way of writing v = (v == 0 ? 1 : 0); [closed]

Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 4 years ago.
Improve this question
I want to toggle a variable between 0 and 1. If it's 0 I want to set it to 1, else if it's 1 I want to set it to 0.
This is such a fundamental operation that I write so often I'd like to investigate the shortest, clearest possible way of doing it. Here's my best so far:
v = (v == 0 ? 1 : 0);
Can you improve on this?
Edit: the question is asking how to write the above statement in the fewest characters while retaining clarity - how is this 'not a real question'? This wasn't intended to be a code-golf exercise, though some interesting answers have come out of people approaching it as golf - it's nice to see golf being used in a constructive and thought-provoking manner.
You can simply use:
v = 1 - v;
This of course assumes that the variable is initialised properly, i.e. that it only has the value 0 or 1.
Another method that is shorter but uses a less common operator:
v ^= 1;
Edit:
To be clear; I never approached this question as code golf, just to find a short way of doing the task without using any obscuring tricks like side effects of operators.
Since 0 is a false value and 1 is a true value.
v = (v ? 0 : 1);
If you are happy to use true and false instead of numbers
v = !v;
or if they must be numbers:
v = +!v; /* Boolean invert v then cast back to a Number */
v = (v + 1) % 2 and if you need to cycle through more values just change 2 for (n + 1). Say you need to cycle 0,1,2 just do v = (v + 1) % 3.
You could write a function for it and use it like:
v = inv(v)
If you don't care about any possibility other than 1:
v = v ? 0 : 1;
In the above case, v will end up being 1 if v is 0, false, undefined or null. Take care using this kind of approach - v will be 0 even if v is "hello world".
Lines like v = 1 - v, or v ^= 1 or v= +!v will all get the job done, but they constitute what I would refer to as hacks. These are not beautiful lines of code, but cheap tricks to have the intended effect. 1 - v does not communicate "toggle the value between 0 and 1". This makes your code less expressive and introduces a place (albeit a small one) where another developer will have to parse your code.
Having instead a function like v = toggle(v) communicates the intent at the quickest glance.
(Honesty and mathematical integrity - given the number of votes on this "answer" - have led me to edit this answer. I held off as long as possible because it was intended as a short quip and not as anything "deep" so putting in any explanation seemed counter to the purpose. However, the comments are making it clear that I should be clear to avoid misunderstanding.)
My original answer:
The wording of this part of the specification:
If it's 0, I want to set it to 1, else set it to 0.
implies that the most accurate solution is:
v = dirac_delta(0,v)
First, the confession: I did get my delta functions confused. The Kronecker delta would have been slightly more appropriate, but not by much as I wanted something that was domain-independent (the Kronecker delta is mainly used just for integers). But I really shouldn't have used delta functions at all, I should have said:
v = characteristic_function({0},v)
Let me clarify. Recall that a function is a triple, (X,Y,f), where X and Y are sets (called the domain and codomain respectively) and f is a rule that assigns an element of Y to each element of X. We often write the triple (X,Y,f) as f: X &rightarrow; Y. Given a subset of X, say A, there is a characteristic function which is a function χA: X &rightarrow; {0,1} (it can also be thought of as a function to a larger codomain such as &Nopf; or &Ropf;). This function is defined by the rule:
χA(x) = 1 if x &in; A and χA(x) = 0 if x ∉ A.
If you like truth tables, it's the truth table for the question "Is the element x of X an element of the subset A?".
So from this definition, it's clear that the characteristic function is what is needed here, with X some big set containing 0 and A = {0}. That's what I should have written.
And so to delta functions. For this, we need to know about integration. Either you already know it, or you don't. If you don't, nothing I can say here will tell you about the intricacies of the theory, but I can give a one sentence summary. A measure on a set X is in essence "that which is needed to make averages work". That is to say that if we have a set X and a measure μ on that set then there is a class of functions X &rightarrow; &Ropf;, called measurable functions for which the expression ∫X f dμ makes sense and is, in some vague sense, the "average" of f over X.
Given a measure on a set, one can define a "measure" for subsets of that set. This is done by assigning to a subset the integral of its characteristic function (assuming that this is a measurable function). This can be infinite, or undefined (the two are subtly different).
There are lots of measures around, but there are two that are important here. One is the standard measure on the real line, &Ropf;. For this measure, then ∫&Ropf; f dμ is pretty much what you get taught in school (is calculus still taught in schools?): sum up little rectangles and take smaller and smaller widths. In this measure, the measure of an interval is its width. The measure of a point is 0.
Another important measure, which works on any set, is called the point measure. It is defined so that the integral of a function is the sum of its values:
∫X f dμ = ∑x &in;X f(x)
This measure assigns to each singleton set the measure 1. This means that a subset has finite measure if and only if it is itself finite. And very few functions have finite integral. If a function has a finite integral, it must be non-zero only on a countable number of points. So the vast majority of functions that you probably know do not have finite integral under this measure.
And now to delta functions. Let's take a very broad definition. We have a measurable space (X,μ) (so that's a set with a measure on it) and an element a &in; X. We "define" the delta function (depending on a) to be the "function" δa: X &rightarrow; &Ropf; with the property that δa(x) = 0 if x ≠ a and ∫X δa dμ = 1.
The most important fact about this to get a-hold of is this: The delta function need not be a function. It is not properly defined: I have not said what δa(a) is.
What you do at this point depends on who you are. The world here divides in to two categories. If you are a mathematician, you say the following:
Okay, so the delta function might not be defined. Let's look at its hypothetical properties and see if we can find a proper home for it where it is defined. We can do that, and we end up with distributions. These are not (necessarily) functions, but are things that behave a little like functions, and often we can work with them as if they were functions; but there are certain things that they don't have (such as "values") so we need to be careful.
If you are not a mathematician, you say the following:
Okay, so the delta function might not be properly defined. Who says so? A bunch of mathematicians? Ignore them! What do they know?
Having now offended my audience, I shall continue.
The dirac delta is usually taken to be the delta function of a point (often 0) in the real line with its standard measure. So those who are complaining in the comments about me not knowing my deltas are doing so because they are using this definition. To them, I apologise: although I can wriggle out of that by using the Mathematician's defence (as popularised by Humpty Dumpty: simply redefine everything so that it is correct), it is bad form to use a standard term to mean something different.
But there is a delta function which does do what I want it to do and it is that which I need here. If I take a point measure on a set X then there is a genuine function δa : X &rightarrow; &Ropf; which satisfies the criteria for a delta function. This is because we are looking for a function X &rightarrow; &Ropf; which is zero except at a and such that the sum of all of its values is 1. Such a function is simple: the only missing piece of information is its value at a, and to get the sum to be 1 we just assign it the value 1. This is none other than the characteristic function on {a}. Then:
∫X δa dμ = ∑x &in; X δa(x) = δa(a) = 1.
So in this case, for a singleton set, the characteristic function and the delta function agree.
In conclusion, there are three families of "functions" here:
The characteristic functions of singleton sets,
The delta functions,
The Kronecker delta functions.
The second of these is the most general as any of the others is an example of it when using the point measure. But the first and third have the advantage that they are always genuine functions. The third is actually a special case of the first, for a particular family of domains (integers, or some subset thereof).
So, finally, when I originally wrote the answer I wasn't thinking properly (I wouldn't go so far as to say that I was confused, as I hope I've just demonstrated I do know what I'm talking about when I actually think first, I just didn't think very much). The usual meaning of the dirac delta is not what is wanted here, but one of the points of my answer was that the input domain was not defined so the Kronecker delta would also not have been right. Thus the best mathematical answer (which I was aiming for) would have been the characteristic function.
I hope that that is all clear; and I also hope that I never have to write a mathematical piece again using HTML entities instead of TeX macros!
in general whenever you need to toggle between two values , you can just subtract the current value from the sum of the two toggle values :
0,1 -> v = 1 - v
1,2 -> v = 3 - v
4,5 -> v = 9 - v
You could do
v = Math.abs(--v);
The decrement sets the value to 0 or -1, and then the Math.abs converts -1 to +1.
If it must be the integer 1 or 0, then the way you're doing it is fine, though parentheses aren't needed. If these a are to be used as booleans, then you can just do:
v = !v;
v = v == 0 ? 1 : 0;
Is enough !
List of solutions
There are three solutions I would like to propose. All of them convert any value to 0 (if 1, true etc.) or 1 (if 0, false, null etc.):
v = 1*!v
v = +!v
v = ~~!v
and one additional, already mentioned, but clever and fast (although works only for 0s and 1s):
v = 1-v
Solution 1
You can use the following solution:
v = 1*!v
This will first convert the integer to the opposite boolean (0 to True and any other value to False), then will treat it as integer when multiplying by 1. As a result 0 will be converted to 1 and any other value to 0.
As a proof see this jsfiddle and provide any values you wish to test: jsfiddle.net/rH3g5/
The results are as follows:
-123 will convert to integer 0,
-10 will convert to integer 0,
-1 will convert to integer 0,
0 will convert to integer 1,
1 will convert to integer 0,
2 will convert to integer 0,
60 will convert to integer 0,
Solution 2
As mblase75 noted, jAndy had some other solution that works as mine:
v = +!v
It also first makes boolean from the original value, but uses + instead of 1* to convert it into integer. The result is exactly the same, but the notation is shorter.
Solution 3
The another approach is to use ~~ operator:
v = ~~!v
It is pretty uncommon and always converts to integer from boolean.
To sum up another answer, a comment and my own opinion, I suggest combining two things:
Use a function for the toggle
Inside this function use a more readable implementation
Here is the function which you could place in a library or maybe wrap it in a Plugin for another Javascript Framework.
function inv(i) {
if (i == 0) {
return 1
} else {
return 0;
}
}
And the usage is simply:
v = inv(v);
The advantages are:
No code Duplication
If you or anybody read this again in the future, you will understand your code in a minimum of time.
This is missing:
v = [1, 0][v];
It works as round robin as well:
v = [2, 0, 1][v]; // 0 2 1 0 ...
v = [1, 2, 0][v]; // 0 1 2 0 ...
v = [1, 2, 3, 4, 5, 0][v]; // 0 1 2 3 4 5 ...
v = [5, 0, 1, 2, 3, 4][v]; // 0 5 4 3 2 1 0 ...
Or
v = {0: 1, 1: 0}[v];
The charme of the last solution, it works with all other values as well.
v = {777: 'seven', 'seven': 777}[v];
For a very special case, like to get a (changing) value and undefined, this pattern may be helpful:
v = { undefined: someValue }[v]; // undefined someValue undefined someValue undefined ...
I don't know why you want to build your own booleans? I like the funky syntaxes, but why not write understandable code?
This is not the shortest/fastest, but the most clearest (and readable for everyone) is using the well-known if/else state:
if (v === 0)
{
v = 1;
}
else
{
v = 0;
}
If you want to be really clear, you should use booleans instead of numbers for this. They are fast enough for most cases. With booleans, you could just use this syntax, which will win in shortness:
v = !v;
Another form of your original solution:
v = Number(v == 0);
EDIT: Thanks TehShrike and Guffa for pointing out the error in my original solution.
I would make it more explicit.
What does v mean?
For example when v is some state. Create an object Status. In DDD an value object.
Implement the logic in this value object. Then you can write your code in a more functional way which is more readable. Switching status can be done by creating a new Status based on the current status. Your if statement / logic is then encapsulated in your object, which you can unittest. An valueObject is always immutable, so it has no identity. So for changing it's value you have to create a new one.
Example:
public class Status
{
private readonly int _actualValue;
public Status(int value)
{
_actualValue = value;
}
public Status(Status status)
{
_actualValue = status._actualValue == 0 ? 1 : 0;
}
//some equals method to compare two Status objects
}
var status = new Status(0);
Status = new Status(status);
Since this is JavaScript, we can use the unary + to convert to int:
v = +!v;
This will logical NOT the value of v (giving true if v == 0 or false if v == 1). Then we convert the returned boolean value into its corresponding integer representation.
Another way to do it:
v = ~(v|-v) >>> 31;
One more:
v=++v%2
(in C it would be simple ++v%=2)
ps. Yeah, I know it's double assignment, but this is just raw rewrite of C's method (which doesn't work as is, cause JS pre-increment operator dosen't return lvalue.
If you're guaranteed your input is either a 1 or a 0, then you could use:
v = 2+~v;
Just for kicks: v = Math.pow(v-1,v) also toggles between 1 and 0.
define an array{1,0}, set v to v[v], therefore v with a value of 0 becomes 1, and vica versa.
Another creative way of doing it, with v being equal to any value, will always return 0 or 1
v = !!v^1;
If possible values for v are only 0 and 1, then for any integer x, the expression:
v = Math.pow((Math.pow(x, v) - x), v);
will toggle the value.
I know this is an ugly solution and the OP was not looking for this...but I was thinking about just another solution when I was in the loo :P
Untested, but if you're after a boolean I think var v = !v will work.
Reference: http://www.jackfranklin.co.uk/blog/2011/05/a-better-way-to-reverse-variables
v=!v;
will work for v=0 and v=1; and toggle the state;
If there are just two values, as in this case(0, 1), i believe it's wasteful to use int. Rather go for boolean and work in bits. I know I'm assuming but in case of toggle between two states boolean seems to be ideal choice.
v = Number(!v)
It will type cast the Inverted Boolean value to Number, which is the desired output.
Well, As we know that in javascript only that Boolean comparison will also give you expected result.
i.e. v = v == 0 is enough for that.
Below is the code for that:
var v = 0;
alert("if v is 0 output: " + (v == 0));
setTimeout(function() {
v = 1;
alert("if v is 1 Output: " + (v == 0));
}, 1000);
JSFiddle: https://jsfiddle.net/vikash2402/83zf2zz0/
Hoping this will help you :)

Categories