How to use the protractor.element function in protractor

private get _xmlCodeBlock(): ElementFinder {
    const codeBlockByTag: By = by.tagName('code');

    return element(codeBlockByTag);
  }

it('should set header sort', async () => {
            browser.switchTo().defaultContent();
            await waitForPresence('.jigsaw-table-sort-up');
            const tableSortUp = element(by.css('.jigsaw-table-sort-up')),
                tableSortDown = element(by.css('.jigsaw-table-sort-down')),
                columnFirstEl = element(by.css('.jigsaw-table-body tbody')).all(by.tagName('TR')).first().all(by.tagName('TD')).get(0),
                columnlastEl = element(by.css('.jigsaw-table-body tbody')).all(by.tagName('TR')).last().all(by.tagName('TD')).get(0);
            expect(columnFirstEl.getText()).toBe('Michelle');
            expect(columnlastEl.getText()).toBe('Dave');
            tableSortUp.click();
            expect(columnFirstEl.getText()).toBe('Abner');
            expect(columnlastEl.getText()).toBe('Wanda');
            tableSortDown.click();
            expect(columnFirstEl.getText()).toBe('Wanda');
            expect(columnlastEl.getText()).toBe('Abner');
        })
    });

async go() {
        await browser.get('#/builders');
        await browser.wait(EC.urlContains('#/builders'),
                           10000,
                           "URL does not contain #/builders");
        let localBuilder = element(By.linkText(this.builder));
        await browser.wait(EC.elementToBeClickable(localBuilder),
                           5000,
                           "local builder not clickable");
        await localBuilder.click();
    }

getImageBottomElement() {
    return element(by.css('.sn-image-loader--bottom .img'));
  }

cancelDeleteConfirmation() {
    let walletCount = 0;
    element.all(by.css('.-wallet')).count().then((count) => walletCount = count);

    return element(by.buttonText('No')).click().then(() => {
      return element.all(by.css('.-wallet')).count().then((count) => {
        return count === walletCount;
      });
    });
  }

stepSelectContainer(stepName: string) {
    return element(by.cssContainingText("h3.step-name", stepName));
  }

stepTargetFormatOptions(option: string) {
    return element(by.cssContainingText('mat-option .mat-option-text', option));
  }

async addRole(name: string) {
        await this.root.element(by.css('mesh-user-role-select button')).click();
        await element(by.cssContainingText('gtx-dropdown-content gtx-dropdown-item', name)).click();
    }

getParagraphText() {
    return element(by.css('my-app p')).getText();
  }
}

matchOptionWeightInput(property: string) {
    return element(by.css(`.match-option-${property} .match-option-weight input.mat-input-element`));
  }