> 웹 프론트엔드 > JS 튜토리얼 > 개발 중에 일반적으로 사용되는 js 메서드 캡슐화(요약)

개발 중에 일반적으로 사용되는 js 메서드 캡슐화(요약)

青灯夜游
풀어 주다: 2018-10-11 15:45:46
앞으로
1884명이 탐색했습니다.

이 기사에서는 개발 중에 일반적으로 사용되는 js 메소드 캡슐화에 대해 소개합니다. 이는 특정 참고 가치가 있으므로 도움이 될 수 있습니다.

1. 배열인지 확인

function isArray(arr){
return Object.prototype.toString.call(arr) ==='[object Array]';
}
 
isArray([1,2,3]) //true
로그인 후 복사

2. 함수인지 확인(3가지 유형)

function isFunction(fn) {
return Object.prototype.toString.call(fn) ==='[object Function]';
return fn.constructor == Function;
return fn instanceof Function;
return typeof (fn) == Function;
}
로그인 후 복사

3. 배열의 요소가 숫자인지 문자열인지만 고려하세요.

function newarr(arr){
var arrs = [];
for(var i =0;i<arr.length;i++){
if(arrs.indexOf(arr[i])== -1){
arrs.push(arr[i])
}
}
return arrs;
}
로그인 후 복사

4. 동적 중복 제거

var arr = [1,2, 3, 4];
function add() {
var newarr = [];
$(&#39;.addEle&#39;).click(() => {
var rnd = Math.ceil(Math.random() * 10);
newarr.push(rnd)
for (var i =0; i < newarr.length; i++) {
if (arr.indexOf(newarr[i]) == -1) {
arr.push(newarr[i])
arr.sort(function (a, b) {
return b - a //降序
});
}
}
console.log(arr)//[1,2,3,4,5,6,7,8,9]
})
}
add()
로그인 후 복사

5. 문자열 공백 제거(3가지 상황 포함)

function trim(str) {
return str.replace(/^[" "||" "]*/,"").replace(/[" "|" "]*$/,"");// 去除头和尾
return str.replace(/\s/g,&#39;&#39;);//去除所有空格
return str.replace(/(\s*$)/g,"");//去除右边所有空格
}
로그인 후 복사

6. 이메일 주소인지 확인합니다. 휴대폰 번호

function isEmail(emailStr) {
var reg = /^[a-zA-Z0-9]+([._-]*[a-zA-Z0-9]*)*@[a-zA-Z0-9]+.[a-zA-Z0-9{2,5}$]/;
var result = reg.test(emailStr);
if (result) {
alert("ok");
} else {
alert("error");
}
}
로그인 후 복사

8 개체의 첫 번째 요소 번호를 가져옵니다

function isMobilePhone(phone) {
var reg = /^1\d{10}$/;
if (reg.test(phone)) {
alert(&#39;ok&#39;);
} else {
alert(&#39;error&#39;);
}
}
로그인 후 복사

9. 브라우저 창을 기준으로 요소의 위치를 ​​가져오고 {x,y} 개체를 반환합니다

function getObjectLength(obj){
var i=0;
for( var attrin obj){
if(obj.hasOwnProperty(attr)){
i++;
}
}
console.log(i);
}
var obj = {name:&#39;kob&#39;,age:20};
getObjectLength(obj) //2
로그인 후 복사
.

10. 특정 문자열에 문자가 나타나는 횟수

function getPosition(element) {
var offsety = 0;
offsety += element.offsetTop;
var offsetx = 0;
offsetx += element.offsetLeft;
if (element.offsetParent != null) {
getPosition(element.offsetParent);
}
return { Left: offsetx, Top: offsety };
} 
로그인 후 복사

11. 배열에서 가장 많이 나타나는 요소를 계산합니다.

var str = &#39;To be, or not to be, that is the question.&#39;;
var count = 0;
var pos = str.indexOf(&#39;e&#39;);
while (pos !== -1) {
count++;
pos = str.indexOf(&#39;e&#39;, pos + 1);
}
console.log(count) //4
로그인 후 복사

12. 배열 필터(검색 기능)

var arrayObj = [1,1, 2, 3, 3, 3,4, 5, 5];
var tepm = &#39;&#39;,count =0;
var newarr = new Array();
for(var i=0;i<arrayObj.length;i++){
if (arrayObj[i] != -1) {
temp = arrayObj[i];
}
for(var j=0;j<arrayObj.length;j++){
if (temp == arrayObj[j]) {
count++;
arrayObj[j] = -1;
}
}
newarr.push(temp + ":" + count);
count = 0;
}
for(var i=0;i<newarr.length;i++){
  console.log(newarr[i]);
}
로그인 후 복사

13. 객체 복사(첫 번째 유형) )

var fruits = [&#39;apple&#39;,&#39;banana&#39;, &#39;grapes&#39;,&#39;mango&#39;, &#39;orange&#39;];
function filterItems(query) {
return fruits.filter(function(el) {
return el.toLowerCase().indexOf(query.toLowerCase()) > -1;
})
}

console.log(filterItems(&#39;ap&#39;)); // [&#39;apple&#39;, &#39;grapes&#39;]
로그인 후 복사

14. 심층 복제

//第一种
var cloneObj =function(obj) {
var newObj = {};
if (obj instanceof Array) {
newObj = [];
}
for (var keyin obj) {
var val = obj[key];
newObj[key] = typeof val === &#39;object&#39; ? cloneObj(val) : val;
}
return newObj;
};
//第二种
function clone(origin , target){
var target = target || {};
for(var propin origin){
target[prop] = origin[prop];
}
return target;
} 
로그인 후 복사

15. json 배열 제거

var newObj ={};
function deepClone(origin,target){
var target = target || {},
toStr = Object.prototype.toString,
arrStr = "[object Array]";

for(var propin origin){
if(origin.hasOwnProperty(prop)){
if(origin[prop] != "null" && typeof(origin[prop]) == &#39;object&#39;){//判断原型链
target[prop] = (toStr.call(origin[prop]) == arrStr) ? [] : {}//判断obj的key是否是数组
deepClone(origin[prop],target[prop]);//递归的方式
}else{
target[prop] = origin[prop];
}
}
}
return target

}

deepClone(obj,newObj);
console.log(newObj)
로그인 후 복사

16.

Array.prototype.max = function(){
return Math.max.apply({},this)
}
 
Array.prototype.min = function(){
return Math.min.apply({},this)
}
 
console.log([1,5,2].max())
로그인 후 복사

17. 두 배열을 비교하고 교차점을 제거합니다

function UniquePay(paylist){
var payArr = [paylist[0]];
for(var i =1; i < paylist.length; i++){
var payItem = paylist[i];
var repeat = false;
for (var j =0; j < payArr.length; j++) {
if (payItem.name == payArr[j].name) {
repeat = true;
break;
}
}
if (!repeat) {
payArr.push(payItem);
}
}
return payArr;
} 
로그인 후 복사

18. 배열 요소

Array.intersect = function () {
var result = new Array();
var obj = {};
for (var i =0; i < arguments.length; i++) {
for (var j =0; j < arguments[i].length; j++) {
var str = arguments[i][j];
if (!obj[str]) {
obj[str] = 1;
}
else {
obj[str]++;
if (obj[str] == arguments.length)
{
result.push(str);
}
}//end else
}//end for j
}//end for i
return result;
}
console.log(Array.intersect(["1","2", "3"], ["2","3", "4", "5", "6"]))
로그인 후 복사

19와 키가 동일한 객체를 꺼냅니다. 배열에서 요소를 삭제합니다

var arr = [&#39;F00006&#39;,&#39;F00007&#39;,&#39;F00008&#39;];
var obj = {&#39;F00006&#39;:[{&#39;id&#39;:21}],&#39;F00007&#39;:[{&#39;id&#39;:11}]}
var newobj = {};
for(var itemin obj){
if(arr.includes(item)){
newobj[item] = obj[item]
}
}
console.log(newObj)
로그인 후 복사

20. 배열에 특정 요소가 포함되어 있는지 확인합니다

//第一种
Array.prototype.remove = function(val){
var index = this.indexOf(val);
if(index !=0){
this.splice(index,1)
}
}
[1,3,4].remove(3)
//第二种
function remove(arr, indx) {
for (var i =0; i < arr.length; i++) {
var index = arr.indexOf(arr[i]);
if (indx == index) {
arr.splice(index, 1)
}
}
return arr
}
로그인 후 복사
요약: 위는 이 기사의 전체 내용이 모든 사람의 연구에 도움이 되기를 바랍니다. 더 많은 관련 튜토리얼을 보려면 JavaScript 비디오 튜토리얼

을 방문하세요! 관련 권장 사항:

php 공공 복지 교육 비디오 튜토리얼

JavaScript 그래픽 튜토리얼

JavaScript 온라인 매뉴얼

위 내용은 개발 중에 일반적으로 사용되는 js 메서드 캡슐화(요약)의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:cnblogs.com
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿