function
or var declarations in nested blocks is not preferred JS-00161005
1006 var force = (-repulseRadius / d) * 1;
1007
1008 function process() {1009 var f = Math.atan2(dy, dx);1010 p.vx = force * Math.cos(f);1011 p.vy = force * Math.sin(f);10121013 if (pJS.particles.move.out_mode == "bounce") {1014 var pos = {1015 x: p.x + p.vx,1016 y: p.y + p.vy,1017 };1018 if (pos.x + p.radius > pJS.canvas.w) p.vx = -p.vx;1019 else if (pos.x - p.radius < 0) p.vx = -p.vx;1020 if (pos.y + p.radius > pJS.canvas.h) p.vy = -p.vy;1021 else if (pos.y - p.radius < 0) p.vy = -p.vy;1022 }1023 }1024
1025 // default
1026 if (d <= repulseRadius) {
892 }
893 }
894
895 function process(bubble_param, particles_param, p_obj_bubble, p_obj, id) { 896 if (bubble_param != particles_param) { 897 if (!pJS.tmp.bubble_duration_end) { 898 if (dist_mouse <= pJS.interactivity.modes.bubble.distance) { 899 if (p_obj_bubble != undefined) var obj = p_obj_bubble; 900 else var obj = p_obj; 901 if (obj != bubble_param) { 902 var value = 903 p_obj - 904 (time_spent * (p_obj - bubble_param)) / 905 pJS.interactivity.modes.bubble.duration; 906 if (id == "size") p.radius_bubble = value; 907 if (id == "opacity") p.opacity_bubble = value; 908 } 909 } else { 910 if (id == "size") p.radius_bubble = undefined; 911 if (id == "opacity") p.opacity_bubble = undefined; 912 } 913 } else { 914 if (p_obj_bubble != undefined) { 915 var value_tmp = 916 p_obj - 917 (time_spent * (p_obj - bubble_param)) / 918 pJS.interactivity.modes.bubble.duration, 919 dif = bubble_param - value_tmp; 920 value = bubble_param + dif; 921 if (id == "size") p.radius_bubble = value; 922 if (id == "opacity") p.opacity_bubble = value; 923 } 924 } 925 } 926 } 927
928 if (pJS.tmp.bubble_clicking) {
929 /* size */
803 dist_mouse = Math.sqrt(dx_mouse * dx_mouse + dy_mouse * dy_mouse),
804 ratio = 1 - dist_mouse / pJS.interactivity.modes.bubble.distance;
805
806 function init() { 807 p.opacity_bubble = p.opacity; 808 p.radius_bubble = p.radius; 809 } 810
811 /* mousemove - check ratio */
812 if (dist_mouse <= pJS.interactivity.modes.bubble.distance) {
481 break;
482
483 case "image":
484 function draw() { 485 pJS.canvas.ctx.drawImage( 486 img_obj, 487 p.x - radius, 488 p.y - radius, 489 radius * 2, 490 (radius * 2) / p.img.ratio, 491 ); 492 } 493
494 if (pJS.tmp.img_type == "svg") {
495 var img_obj = p.img.obj;
Function declarations (with the function
keyword) and variable declarations should preferably be in the root of a program or the body of a function.
Having nested function declarations inside blocks may have unexpected results at runtime due to hoisting.
As a rule of thumb, if you ever find yourself needing to use nested functions:
Prefer const f = () => ...
over function f() {...}
for functions inside block-statements.
When using function
or var
, do not have any declarations that can possibly be accessed outside the block in which they're declared.
Note: Block bindings (let
, const
) are not hoisted and therefore they are not affected by this rule.
function outer(test) {
if (test) {
// the declaration for "inner" can
// be accessed outside the if-statement
// only when `test` is truthy.
function inner() {
return "inner value";
}
inner();
}
// works only if `test` is true.
return inner();
}
outer(true); // "inner value"
outer(false); // TypeError: inner is not a function
inner
should be moved out of the if
block, or be declared with a const
keyword.
// When `inner` is needed outside the `if` block:
function outer(test) {
const inner = () => "inner value"
if (test) {
inner();
}
// always works.
return inner();
}
// When `inner` is not needed outside the `if` block:
function outer(test) {
if (test) {
const inner = () => "inner value"
inner();
}
return "outer value"
}