1.js判斷對象是否存在屬性。

? ??hasOwnProperty(‘property’)? 判斷原型屬性是否存在。

? ? "property" in o; ?判斷原型屬性和原型鏈屬性是否存在。

2.js 對象比較? ? ?

var obj1 = {"emailadr": "sroot@qq.com","emailpas": "1000" };var obj2 = {"emailadr": "sroot@qq.com","emailpas": "1000" };console.log(obj1==obj2) // false ，比較對象的內(nèi)存地址，不是內(nèi)容

? ? ?最簡單的方法是直接轉(zhuǎn)成字符串，再進(jìn)行比較。

3.深拷貝與淺拷貝

? ? ?淺度拷貝，即復(fù)制一個(gè)引用類型的指針。

? ? ?深度拷貝，即復(fù)制一個(gè)一模一樣完整引用類型。

? ? ?判斷淺度拷貝或深度拷貝依據(jù)比較兩個(gè)對象內(nèi)存地址是否相等，相等就是淺度拷貝，不相等就是深度拷貝。?

PS：引用類型指的是對象、數(shù)組、函數(shù)。

? ? ? ? 值類型指的是數(shù)值、字符串、布爾型、null、undefined。?

4.js訪問對象屬性

//使用.來訪問 var myCar = new Object(); myCar.make = "Ford";//使用[]來訪問 myCar["make"] = "Ford";

5.js對象繼承

//學(xué)生類 function Student(name，age){this.name = name；this.age = age; }//小學(xué)生類 function Pupil(name,age){this.stu=Student;this.stu(name,age); }var s = new Pupil('cww', 10) console.log(s.name) //cww

PS:可以多繼承和重寫，沒有重載，如有同名函數(shù)，只執(zhí)行最后的一個(gè)方法。

6.js面向?qū)ο蟆?/p>

非對象設(shè)計(jì)

function popBox() {alert('彈出盒子') } popBOX() //不知道是指哪個(gè)彈出盒子。 優(yōu)點(diǎn)：代碼簡練。 缺點(diǎn)：語義化不明確，容易全局污染。 對象設(shè)計(jì) var Top = {popBox: function() {alert('彈出盒子')} } Top.popBox() // 頂部模塊彈出盒子 優(yōu)點(diǎn)：有命名空間（實(shí)現(xiàn)模塊化），可拓展（便于繼承），避免函數(shù)重名，明確語義化。 缺點(diǎn)：代碼冗余。 7.js?對象方法類型 對象方法?（js對象需要new才能使用的方法） // 構(gòu)造函數(shù)Person function Person() {
this.walk = function() {alert('I can walk')} }var p1 = new Person() p1.walk()

? ??類方法??（js對象不需要new使用的方法）

// 構(gòu)造函數(shù)Person var Person = {walk: function() {alert('I can walk')} }//等價(jià)于 //function Person() {} //Person.walk = function() { // alert('I can walk') //} Person.walk() 原型方法?（js對象繼承拓展的方法，需要new才能使用的方法） // 構(gòu)造函數(shù)Person function Person(name) {this.name = name } Person.prototype.sayName = function() {alert('my name is:' + this.name) }
Person.prototype.age = 18
var p1 = new Person('sroot')
p1.sayName()

PS：原型方法與對象方法比較。

? ? ? ? 使用原型方法更好，提高js使用內(nèi)存效率，所有的new對象都共享方法。

? ? ? ? 原型方法（實(shí)例方法）與類方法（靜態(tài)方法）比較。

? ? ? ? 靜態(tài)方法在程序開始時(shí)生成內(nèi)存。實(shí)例方法在程序運(yùn)行中生成內(nèi)存。

? ? ? ? 靜態(tài)方法常見于公用的方法，不需要依賴其他屬性，不會被重寫。實(shí)例方法常見于具體某個(gè)對象的方法。

8.函數(shù)聲明與函數(shù)表達(dá)式區(qū)別

foo1(); //需要初始化 function foo1(){}; //事先定義這個(gè)函數(shù)，不可以匿名。var foo2 = function(){};//遇到才執(zhí)行這個(gè)函數(shù)，可以匿名，函數(shù)可以內(nèi)部調(diào)用。 foo2();//必須在foo2函數(shù)表達(dá)式后面。

9.js跨域問題（不同域名之間的js不能相互操作）

? ? ?只要是端口，協(xié)議，域名不同都算跨域。

? ? （1）使用jsonp。

? ? ? ? ? ? ?通過script標(biāo)簽（script標(biāo)簽的src屬性是沒有跨域的限制的），引入其他域名下的帶參數(shù)函數(shù)，從而讀取跨域數(shù)據(jù)。（僅支持get請求）? ? ? ? ? ?

<script type="text/javascript">//返回函數(shù)一定要事先聲明，否則jsonp請求返回的函數(shù)是Undefinedfunction callbackFunction(result) {console.log(result)}// 提供jsonp服務(wù)的url地址// url后面參數(shù)可有可無，建議設(shè)置參數(shù)，有利于可以動態(tài)獲取返回?cái)?shù)據(jù)，告訴后端“我需要一個(gè)callbackFunction函數(shù)代碼”，函數(shù)名不是固定的。var url = 'http://www.runoob.com/try/ajax/jsonp.php?jsoncallback=callbackFunction'var script = document.createElement('script')script.setAttribute('src', url)document.getElementsByTagName('head')[0].appendChild(script) </script> <!-- 不建議寫死script標(biāo)簽的src --> <!-- <script type="text/javascript" src="http://www.runoob.com/try/ajax/jsonp.php?jsoncallback=callbackFunction"></script> -->

? ?（2）使用iframe。

? ? ? ? ? ? ?創(chuàng)建一個(gè)iframe，修改domain，讀取iframe里面的數(shù)據(jù)。

? ?（3）服務(wù)端設(shè)置跨域請求頭。

? ?（4）使用瀏覽器代理插件。（Allow-Control-Allow-Origin: *插件）

PS：jsonp安全問題：建議請求驗(yàn)證的refer字段或token，否則會出現(xiàn)CSRF攻擊漏洞。

10.js判斷條件優(yōu)化

（1）把最常出現(xiàn)的結(jié)果排在前面

// var value = xxx if (value === 4) {} else if (value === 3) {} else if (value === 1) {} else if (value === 2) {} else if (value === 0) {}

（2）拆分條件

// var value = xxx if (value <= 4) {if (value > 2) {if (value === 3) {} else if (value === 4) {}} else {if (value === 0) {} else if (value === 1) {} else if (value === 2) {}} }

（3）switch語句

//var value = xxx switch(value){case 1:break;case 2:break;default:}

PS：default關(guān)鍵字后面無需加break關(guān)鍵字。

? ? ? ? 參數(shù)是固定值采用switch語句。

? ? ? ? 參數(shù)是范圍值采用if語句。

（4）數(shù)據(jù)查詢

//var value =xxxvar arrRes = [0，1，2，3，4]var results = arrRes[value]

11.js使用別名

function $(id) {return document.getElementById(id) }var titleCss = $('title').style titleCss.color = 'red'

節(jié)省代碼，便于書寫。

12：js遍歷語句

//for遍歷（適用于數(shù)組對象） for (var i = 1; 1 < 5; i++) {console.log(i); }//for...in遍歷（適用于數(shù)組對象） var arrData1=[{name:"foo1"},{name:"foo2"}]for (var key in arrData1) {console.log(arrData1[key].name) }//Array.prototype.map()遍歷（適用于數(shù)組對象） var arrData2 = [10, 50, 100]; arrData2.map(x => console.log(x));

PS：性能高到低??for > map > for..in?

for...in遍歷? > Object.keys遍歷

? ? ? ? ?盡可能使用 for循環(huán)，不要使用增強(qiáng)的for循環(huán)。

13.js阻止頁面內(nèi)部iframe運(yùn)行。

if (navigator.appName == 'Microsoft Internet Explorer') {window.frames.document.execCommand('Stop')} else {window.frames.stop() }

?14.js禁止外部iframe嵌套

if (window.top != window && document.referrer) {var a = document.createElement('a')a.href = document.referrervar host = a.hostnamevar endsWith = function(str, suffix) {return str.indexOf(suffix, str.length - suffix.length) !== -1}if (!endsWith(host, '.test.com') || !endsWith(host, '.test2.com')) {top.location.href = 'http://www.test.com'} }

?15.?捕獲異常

try{ ... }catch(e){var msg = (e.message) ? e.message : e.description;alert(msg); }

?

轉(zhuǎn)載于:https://www.cnblogs.com/Sroot/p/10064607.html

總結(jié)

以上是生活随笔為你收集整理的了解JavaScript核心精髓（三）的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。