How to extract and concatenate two values from two different external JSON files using D3.js version 7

console.log(d.results.tt_nominais) // this is undefined WHY??? <---

You bind geojson to your SVG elements with:

.data(topojson.feature(topology, topology.objects.BRUF).features)

When you use .attr("whatever", function(d) {, the d refers to a single feature in your geojson (topojson.feature converts your topojson to geojson). So naturally, d.results will be undefined as you are not accessing any data from the elections json, only data for a single geojson feature.

There are a few solutions - all essentially accomplish the same thing in GIS terms, a join between your non-spatial data (elections.json) and your spatial data. This join is conducted using the common identifier for a region.

One option would be to create a JavaScript Map for your non-spatial data:

let map = new Map()
electionsData.president.forEach(function(d) {
  map.set(d.cd_ibge,d);
})

Now you can access the data for a district with: map.get(codarea) where codarea is a valid identifier (returning an item in the president array in your elections data).

This gives us:

   .style("fill", function(d){
        console.log(d.properties.codarea) // this gives us the expected codarea value
        // get the data for the region that indicated by codarea
        let region = map.get(d.properties.codarea)
        
        console.log(region);

        /* Do something with region data */

    })

Since you are only interested in the first candidate in the array for each area, we can use:

   .style("fill", function(d){
        console.log(d.properties.codarea) // this gives us the expected codarea value
        // get the results for that codarea
        let region = map.get(d.properties.codarea);
        let result = region.results[0];

        console.log(result);
       
        /* do something with result */

    })