Calling a smart contract from JavaScript
In this tutorial we’ll see how to call a smart contract function from JavaScript. First is reading the state of a smart contract (e.g. the balance of an ERC20 holder), then we’ll modify the state of the blockchain by making a token transfer. You should already be familiar with setting up a JS environment to interact with the blockchain.
For this example we’ll play with the DAI token, for testing purpose we’ll fork the blockchain using ganache-cli and unlock an address that already has a lot of DAI:
ganache-cli -f https://mainnet.infura.io/v3/[YOUR INFURA KEY] -d -i 66 1 --unlock 0x4d10ae710Bd8D1C31bd7465c8CBC3add6F279E81
To interact with a smart contract we’ll need its address and ABI:
1const ERC20TransferABI = [2 {3 constant: false,4 inputs: [5 {6 name: "_to",7 type: "address",8 },9 {10 name: "_value",11 type: "uint256",12 },13 ],14 name: "transfer",15 outputs: [16 {17 name: "",18 type: "bool",19 },20 ],21 payable: false,22 stateMutability: "nonpayable",23 type: "function",24 },25 {26 constant: true,27 inputs: [28 {29 name: "_owner",30 type: "address",31 },32 ],33 name: "balanceOf",34 outputs: [35 {36 name: "balance",37 type: "uint256",38 },39 ],40 payable: false,41 stateMutability: "view",42 type: "function",43 },44]4546const DAI_ADDRESS = "0x6b175474e89094c44da98b954eedeac495271d0f"Show allCopy
For this project we stripped the complete ERC20 ABI to just keep the balanceOf
and transfer
function but you can find the full ERC20 ABI here(opens in a new tab).
We then need to instantiate our smart contract:
1const web3 = new Web3("http://localhost:8545")23const daiToken = new web3.eth.Contract(ERC20TransferABI, DAI_ADDRESS)Copy
We’ll also set up two addresses:
- the one who will receive the transfer and
- the one we already unlocked that will send it:
1const senderAddress = "0x4d10ae710Bd8D1C31bd7465c8CBC3add6F279E81"2const receiverAddress = "0x19dE91Af973F404EDF5B4c093983a7c6E3EC8ccE"Copy
In the next part we’ll call the balanceOf
function to retrieve the current amount of tokens both addresses hold.
Call: Reading value from a smart contract
The first example will call a “constant” method and execute its smart contract method in the EVM without sending any transaction. For this we’ll read the ERC20 balance of an address. Read our article about ERC20 tokens.
You can access an instantiated smart contract methods that you provided the ABI for as follows: yourContract.methods.methodname
. By using the call
function you’ll receive the result of executing the function.
1daiToken.methods.balanceOf(senderAddress).call(function (err, res) {2 if (err) {3 console.log("An error occurred", err)4 return5 }6 console.log("The balance is: ", res)7})Copy
Remember that DAI ERC20 has 18 decimals which means you need to remove 18 zeros to get the correct amount. uint256 are returned as strings as JavaScript does not handle big numeric values. If you’re not sure how to deal with big numbers in JS check our tutorial about bignumber.js(opens in a new tab).
Send: Sending a transaction to a smart contract function
For the second example we’ll call the transfer function of the DAI smart contract to send 10 DAI to our second address. The transfer function accepts two parameters: the recipient address and the amount of token to transfers:
1daiToken.methods2 .transfer(receiverAddress, "100000000000000000000")3 .send({ from: senderAddress }, function (err, res) {4 if (err) {5 console.log("An error occurred", err)6 return7 }8 console.log("Hash of the transaction: " + res)9 })Show allCopy
The call function returns the hash of the transaction that will be mined into the blockchain. On Ethereum, transaction hashes are predictable - that’s how we can get the hash of the transaction before it is executed (learn how hashes are calculated here(opens in a new tab)).
As the function only submits the transaction to the blockchain, we can’t see the result until we know when it is mined and included in the blockchain. In the next tutorial we’ll learn how to wait for a transaction to be executed on the blockchain by knowing its hash(opens in a new tab).
Last edit: @pettinarip(opens in a new tab), November 23, 2023