Home > Web Front-end > JS Tutorial > body text

Introduction to reference types in js programming

零下一度
Release: 2017-07-17 16:18:07
Original
1261 people have browsed it

Reference type

#     There are two data type values ​​for variables in JS , values ​​of basic types and values ​​of reference types. The basic types are null, undefined, Boolean, string, and number. The values ​​of reference types are references to objects, that is, a pointer to an object.

The reference type is a data structure (called a class in other languages. There was no concept of class before in js, but it is in es6 (a syntactic sugar)). When it is concreted, it becomes Object, so the object is called an instance or value of a reference type. (An object is a combination of key-value pairs.)

From the directory, you can see that the reference types in JavaScript are: Object type, Array type, Data type, RegExp type, Function type, basic built-in type, Single built-in type. Below I will sort out the knowledge points here.

①Reference type is a data structure used to organize data and functions together. It is also called a class. However, JavaScript does not support the basic structure of classes and interfaces, so it is called an object. definition.

②Object is the most used type. There are two ways to create Object.

The first one uses the new operator:

1 var person = new Object();2 person.name = "xuchaoi";3 person.age = 24;
Copy after login
The second one uses object literal notation:

1 var person = {2     name: "xuchaoi",3     age: "24"4 }  // 访问对象的值:person.name
Copy after login
③Creating Array is similar to creating Object. It can be created through the new operator or array literal representation

④ Arrays can be detected through the Array.isArray() method. Because typeof() detects arrays, objects or Null types and returns "object"

⑤Split array into string method: join()

1 var name = ["小明", "小红", "小青"];2 consol.log(name.join("&"));  // 小明&小红&小青
Copy after login
⑥ Arrays simulate data structure stacks. push() adds a value to the end of the array, and pop() removes the item from the end of the array. Thereby realizing the last-in-first-out stack structure

⑦array simulation data structure pair. push() adds a value to the end of the array, and shift() removes the first item of the array. Thus realizing the first-in-first-out pair structure

⑧unshift() is the opposite of shift(). It adds a value to the first item of the array

⑨Array reverse order method: reverse(). This method reverses the order of the array items.

⑩Array sorting method: sort(). By default, it will first perform toString() transformation for each item of the array, and then arrange the array items in ascending order

1 var values = [0, 1, 5, 10, 15];2 console.log(value.sort());    //0,1,10,15,5
Copy after login
This result is obviously not what we want, here sort() The method accepts a comparison function as parameter so that we can control the order. The comparison function has two parameters, the previous value and the next value. If the first value is placed after the second value, a positive number is returned, otherwise a negative number is returned, regardless of which order returns 0.

function compare(value, nextValue) {if(value < nextValue) {return -1;
    } else if(value > nextValue) {return 1;
    } else{return 0;
    }
}var values = [1, 0, 10, 5, 15];
console.log(values.sort(compare));    //0,1,5,10,15
Copy after login
⑪Connect the array: concat(), accept parameters: string, array

⑫Intercept the array (generate a new array without changing the original array) method: slice (). Receives two parameters: starting value, end value (can be omitted).

1 var colors = ["红色", "黄色", "绿色", "蓝色"];2 var colors1 = colors.slice(1);    //截取从起始值到结束(数值都是从0计数)3 var colors2 = colors.slice(1,3)  //截取从起始值到结束值(不包括结束值)4 console.log(colors1);        //["黄色", "绿色", "蓝色"]  5 console.log(colors2);        //["黄色", "绿色"]
Copy after login
⑬Method to operate array: splice(). This method can delete items in the array, insert items into the array, and replace items in the array (that is, delete the array items and add items at the corresponding positions)

⑭ Position method of array items: indexOf(). Search the value we set backward from the first item in the array. Once found, the position index of the value in the array is returned. If not found, -1 is returned. You can use this to check the array

1 //原理说明:利用indexOf只会返回数组中元素首次出现的位置与filter内函数index值的不等进行筛选2 var arry = [1,2,3,4,1,2,3];
3 var newArray = arry.filter(function(element,index,self) {4     return self.indexOf(element) === index;5 });    
//说明:filter()会遍历数组,过滤数组不符合要求的元素6 console.log(newArray);    //[1,2,3,4]
Copy after login
⑮Array traversal map().

1 var numbers = [1, 2, 3, 4, 5];
2 var numbers2 = numbers.map(function(item, index, array){3     
return item * 2;4 });
5 console.log(numbers2);    
 [2,4,6,8,10]
Copy after login
⑯Array traversal forEach()

1 var numbers = [1, 2, 3, 4, 5];
2 numbers.forEach(function(item, index, array){3     
array[index] = item * 2;4 });5 console.log(numbers);    
// [2,4,6,8,10]
Copy after login
⑰Array accumulation iteration method reduce()

1 var numbers = [1, 2, 3, 4, 5];
2 var sum = numbers.reduce(function(prev, cur, index, array) {3     
return prev + cur;4 });    
//reduce迭代函数接受4个参数:前一个值,当前值,项的索引,数组对象5 console.log(sum); 
15
Copy after login
Let’s talk about arrays first, and the next section will continue to talk about the key points to note in the reference type chapter!

The above is the detailed content of Introduction to reference types in js programming. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!