Question

使用javascript有没有快速的方法来交换数组中的2个项目？

因此，如果它是布尔值，则可以

const [isTrue, setIsTrue] = useState(false);

setIsTrue(!isTrue);

但是说我有一个数组

// I want to swap the items in the array on a click 
const [trueOrFalse, setTrueOrFalse] = useState([true, false]);

我想切换它们，如果有两个项目，有没有一种快速的方法来交换数组中的项目

setTrueOrFalse(!trueOrFalse); // would equal [false, true]

<div onClick={() => setTrueOrFalse()} />Swap items in array</div>

我试图将元素从索引0移到索引1，反之亦然。

Answer 1

您可以简单地使用useState setter回调方法进行解构

// I want to swap the items in the array on a click 
const [trueOrFalse, setTrueOrFalse] = useState([true, false]);

const swapState = () => {
    setTrueOrFalse(prevState => {
        const [val1, val2] = prevState;
        return [val2, val1];
    })
}

<div onClick={() => swapState()} />Swap items in array</div>

Working demo

Answer 2

尝试

let a=[true, false];

// inverse values
let b= a.map(x=>!x)

// swap sequence (inplace)
a.reverse();

console.log('inverse values', b);
console.log('swap sequence', a);

Answer 3

您可以使用ES6 destructuring assignment轻松地在单个表达式中交换变量：

//Get inital array from useState and store in 2 variables
var [val1, val2] = useState();

//Check out the values
console.log(`Before swap values: val1 = ${val1}, val2 = ${val2}`);

//Do the swap using array desctructuring:
[val1, val2] = [val2, val1];

//Now see that the values have swapped
console.log(`After swap values: val1 = ${val1}, val2 = ${val2}`);

function useState() {
  return [true, false];
}

Answer 4

您可以使用reverse数组方法

function reverse(a){
  return a.reverse()
}

console.log(reverse([true, false]))

Answer 5

您可以尝试

Array.prototype.swap = function(index1,index2){
	[this[index1], this[index2]] = [this[index2],this[index1]]
}
let arr = [1,2,3,4];
arr.swap(1,2);
console.log(arr);

用React钩子反转数组

5 个答案: