Updated April 6, 2023
Introduction to TypeScript keyof
In TypeScript, keyof is one of the operators that can be used to fetch the user values; also, it follows the union operator formats and its properties; it retrieves the indexes for each value which is specified with the users so we can call it as index type query the keyof operator will be combined to the other predefined keywords like “extends keyof and in keyof” parallely we can use the keyof operator in objects like collections classes that is mapping technique we can store and retrieve the datas by using key and value pairs so by using the map instance object.keys() method will fetch the keys which are stored in the memory.
Syntax:
The TypeScript keyof operator is used for fetching and retrieving the indexes in the key ranges also it is used in the correct and exactly property names are needed and keyof operator used as the indexed type queries which will be yielded through the property ranges for the specific set of objects which is mapped and isolated to the keyof operator in TypeScript.
class classname
{
---- some typescript codes depends upon the requirement----
}
var or let variable name: keyof classname;
varaiable name="";The above codes are the basic syntax for ustilising the keyof operator in TypeScript. Here we have created the class with name and using the var or let data type with the variable name and call the classname with keyof operator whatever value is assigned to the variable name it will display the output screen.
How keyof Work in TypeScript?
- Generally, TypeScript provides the set of utility types operators, keywords, and functions used to develop the applications in user prospectiveness. The keyof operator is also known as indexed type query operator, and it yields the union that contains property names and keys of its operand values and most probably the keyof operator will precede the object literal types, and it is most widely used in the primitive data types. The indexed base type query will fetch the values from the properties and their attributes which is related to the elements like default keywords and their data types.
- The other keywords are used and derived with the character like “T” it covers and uses all the possible values, and it needs more features like arrays, collection techniques in the typescript. By using the object.Key () method we can store and retrieve the keys from the hash memory is hash memory the datas are stored in the hash reference by using some loops like for, forEach the values are iterated and display it on the output console.
- Sometimes keyof method will concatenate the input values that will be in either numeric and non-numeric characters; the array values are stored it as the parent object, and the state is will be a generic one, and the typed function are calling both keys and values as the argument constructor so with the help of keyof operator and the method which retrieve the key index of all the values which is related to the user inputs. The key index is the unique one, so it will not accept the duplicate keys in the script.
Examples of TypeScript keyof
Given below are the examples of TypeScript keyof:
Example #1
Code:
class demo {
p: number = 6253;
r:string="hgsv jshdv jv bhdcwc dbjw gc jshd g hds jchdb jch jewcv whcjbd jcwbd bw d j wb j wdv jwbhd jb wdbj j dwb kjwk b jkb w bjwd b wc kdjb kjd kjd wjbd cjhw wkj db jkwbd wkje b k jw bdghc jdh jwegh wjged jd"
}
class demo1 {
s: keyof demo;
example(t: demo): any {
return t[this.s];
}
}
let d: demo1 = new demo1();
d.s = "p";
d.s="r";
var res = d.example(new demo());
console.log(res);Output:
In the above example, we used the parent and child class relationships with keyof keyword. Here we used one class named like the demo. We have initialized the two variables with two data types like string and numbers; the number variable declares the values with number type and the string values using the string data type. We also used one method like example() in that we have return the values using this keyword. That method will be called from one variable with var global data type, and the values are stored and printed on the output console. With the variable like let and the demo1 class object is created with the let data type, and through its reference, the parent class variables are called through the child class(demo1) references.
Example #2
Code:
function getDemo<T, K extends keyof T>(vars: T, keysobj: K) {
return vars[keysobj];
}
function setDemo<T, K extends keyof T>(vars: T, keysobj: K, valuesobj:T[K]) {
vars[keysobj] = valuesobj;
}
let vars1 = { ac: 10, bd: "hfds hscfd hcdf hwcf h we h hv jg d hq hsd asg asgh asgc hasgdc hs hfwds hwfgcs hwfg qhwv qhws" };
let p = getDemo(vars1, "ac");
let q = getDemo(vars1, "bd");
let re = getDemo(vars1, "uyew wteuy");
setDemo(vars1, "p", "string");
console.log(re);Output:
Example #3
Code:
const vars = ['hdjhg wjgdhv wjhv', 'jhgsd jgdhv', 'cjshdg wjhgd', 'djgh', 'djgh'];
console.log(Object.keys(vars));
const vars1 = { 123: 'jdh', 2365: '73dnb', 365: 'jd3' };
console.log(Object.keys(vars1));
const vars2 = { 7623 : '73 d', 22: 'bjeh', 3: 'ehjw' };
console.log(Object.keys(vars2));
const re = Object.create({}, {
exammple: {
value: function () { return this.example2; }
}
});
re.example2 = 1;
console.log(Object.keys(re));Output:
In the final example, we used the Object.keys() method for retrieving the key index and its values. With the help of this index, we can easily identify the values and print them on the output console.
Rules and Regulations for keyof
- The keyof operator who used for to identify the elements with the help of key indexes.
- By using the Objects.keys() method, we can able to retrieve the key indexes and their values.
- For the above 2 steps, the user can easily retrieve the datas when they are working on the bi-enterprise applications.
Conclusion
In concluded part, the keyof operator uses multi-purposes in the applications. The big enterprise TypeScript based applications are mostly accessing the datas from the back end to the front end with the help of some default methods. By using the methods, we can access the applications probably; the index of the element will be accessed and interact with the server to the UI end.
Recommended Articles
This is a guide to the TypeScript keyof. Here we discuss the introduction, working, examples, rules and regulations for keyof, respectively. You may also have a look at the following articles to learn more –
