Repository files navigation

Các câu hỏi bên dưới chủ yếu về Javascript bao gồm cả Front-end lẫn Back-end. Rất mong sẽ giúp ích cho các bạn trong quá trình ôn luyện Javascript cũng như chuẩn bị phỏng vấn .

Nếu thích hãy để lại cho mình1 STAR nhé . Nếu bạn nào có câu hỏi hay và muốn đóng góp để repository này ngày càng chất lượng đừng ngần ngạiCreate Pull Request để đăng câu mới nhé !

• @quangpl

Trong JavaScript nếu bạn sử dụng một biến không tồn tại và chưa được khai báo, thì JavaScript sẽ đưa ra một lỗivar name is not defined và các lệnh sẽ ngừng thực thi sau đó. Nhưng nếu bạn sử dụngtypeof undeclared_variable thì nó sẽ trả vềundefined.

Tiếp theo, hãy hiểu sự khác biệt giữa khai báo và định nghĩa.

var x là một khai báo vì bạn chưa xác định giá trị của nó, nhưng bạn đang khai báo sự tồn tại của nó và nhu cầu cấp phát bộ nhớ cho chính nó

varx;// khai báo xconsole.log(x);// kết quả : undefined

var x = 1 bao gồm cả khai báo và định nghĩa (chúng ta cũng có thể nói rằng chúng ta đang thực hiện khởi tạo), Ở đây xảy ra 2 việc là khai báo và gán giá trị cho biến x . Trong JavaScript, mọi khai báo biến và khai báo hàm đều được đưa lên đầu phạm vi hiện tại của nó sau đó mới được sử dụng và thuật ngữ này gọi làhoising.

Một biến có thể được khai báo nhưng không được xác định giá trị . Và dĩ nhiên giá trị của nó làundefined.

varx;// khai báo biến xtypeofx==='undefined';// kết quả : true

Một biến có thể không được khai báo cũng không được định nghĩa. Khi chúng ta tham chiếu đên biến đó thì kết quả sẽ làundefined.

console.log (y); // Kết quả:  ReferenceError: y is not defined

http://stackoverflow.com/questions/20822022/javascript-variable-definition-declaration

//  if( x <= 100 ) {...}//  if( !(x > 100) ) {...}

NaN <= 100 là false và NaN> 100 cũng là false, vì vậy nếugiá trị củax làNaN, các câu lệnh không giống nhau.

Điều tương tự cũng xảy ra với bất kỳ giá trị nào của x khi trả vềNaN, ví dụ:undefined,[1,2,5],{a: 22}, v.v.

Đây là lý do tại sao bạn cần chú ý khi xử lý các biến .NaN có thể bằng nhau, nhỏ hơn hoặc nhiều hơn bất kỳ giá trị số nào khác, vì vậy cách tốt nhất để kiểm tra xem giá trị đó có phải làNaN hay không, là sử dụng hàmisNaN ().

Một trong những nhược điểm của việc khai báo các hàm trực tiếp bằng các đối tượng JavaScript là chúng quản lý bộ nhớ rất kém . Song song đó, một bản sao mới của hàm được tạo cho mỗi phiên bản của một đối tượng (biến). Hãy xem ví dụ bên dưới :

varEmployee=function(name,company,salary){this.name=name||"";this.company=company||"";this.salary=salary||5000;// Tạo một hàm/phương thức mới bằng cách này :this.formatSalary=function(){return"$ "+this.salary;};};// �Chúng ta cũng có thể tạo hàm/phương thức mới bằng prototype:Employee.prototype.formatSalary2=function(){return"$ "+this.salary;}// Tạo mới các đối tượng với các đối tượng khác nhauvaremp1=newEmployee('Yuri Garagin','Company 1',1000000);varemp2=newEmployee('Dinesh Gupta','Company 2',1039999);varemp3=newEmployee('Erich Fromm','Company 3',1299483);

Ở đây, mỗi biến đối tượngemp1, emp2,emp3 có bản sao riêng của phương thức formatSalary. Tuy nhiên,formatSalary2 sẽ chỉ được thêm một lần vào một đối tượngEmployee.prototype.

Closure là một hàm được định nghĩa bên trong một hàm khác (được gọi là hàm cha) và có quyền truy cập vào biến được khai báo và định nghĩa trong phạm vi hàm cha.

Closure có quyền truy cập vào biến trong ba phạm vi:

• Biến được khai báo trong phạm vi của chính mình
• Biến được khai báo trong phạm vi hàm cha
• Biến toàn cục

varglobalVar="abc";(functionouterFunction(outerArg){// bắt đầu phạm vi của  outerFunction// Biến bên trong phạm vi của outerFunctionvarouterFuncVar='x';//  Hàm close tự gọi(functioninnerFunction(innerArg){// bắt đầu phạm vi của innerFunction// Biến được khai báo và định nghĩa bên trong pham vi của innerFunctionvarinnerFuncVar="y";console.log("outerArg = "+outerArg+"\n"+"outerFuncVar = "+outerFuncVar+"\n"+"innerArg = "+innerArg+"\n"+"innerFuncVar = "+innerFuncVar+"\n"+"globalVar = "+globalVar);//kết thúc phạm vi của  innerFunction})(5);// Truyền tham số 5// kết thúc phạm vi của  outerFunction})(7);//Truyền tham số 7

innerFunction là một Closure được định nghĩa bên trong outerFunction và có quyền truy cập vào tất cả các biến được khai báo và định nghĩa trong phạm vi hàm cha. Ngoài chức năng này thì Closure có quyền truy cập vào biến toàn cục .

`javascript console.log (mul (2) (3) (4)); // kết quả: 24 console.log (mul (4) (3) (4)); // kết quả: 48 `

Dưới đây là code để giải đề trên :

functionmul(x){returnfunction(y){// hàm ẩn danhreturnfunction(z){// hàm ẩn danhreturnx*y*z;};};}

Ở đây, hàmmul nhận đối số thứ nhất và trả về hàm ẩn danh nhận tham số thứ hai và trả về hàm ẩn danh nhận tham số thứ ba và trả về phép nhân của các đối số được truyền liên tiếp

Trong hàm Javascript được định nghĩa bên trong có quyền truy cập vào biến hàm ngoài và hàm là đối tượng lớp đầu tiên để nó cũng có thể được trả về bởi hàm và được truyền dưới dạng đối số trong hàm khác.Một số điểm cần lưu ý :

• Hàm là một hình thức khác của loại Đối tượng
• Một hàm có thể có các thuộc tính và có một liên kết trả về hàm constructor của nó
• Một hàm có thể được lưu trữ dưới dạng biến
• Một hàm có thể được truyền dưới dạng tham số cho hàm khác
• Một hàm có thể được trả về từ một hàm khác

Ví dụ:

vararrayList=['a','b','c','d','e','f'];

Làm thế nào chúng ta có thể làm trống mảng trên?

Chúng ta hãy thử qua các cách sau đây

javascriptarrayList = [];

Đoạn mã trên sẽ làm cho biến ArrayList thành một mảng trống mới. Cách này được khuyến nghị nếu bạn không cótham chiếu đến mảng ban đầu Ví dụ:

vararrayList=['a','b','c','d','e','f'];// Tạo mảngvaranotherArrayList=arrayList;// Tham chiếu đến arrayList từ một biến khácarrayList=[];// Làm trống mảng đóconsole.log(anotherArrayList);// Kết quả  ['a', 'b', 'c', 'd', 'e', 'f']

arrayList.length=0;

Code trên sẽ xóa mảng hiện có bằng cách đặt độ dài của nó thành 0. Cách làm này cũng sẽ cập nhật tất cả các biến tham chiếu trỏ đến mảng ban đầu.

Ví dụ:

`javascript var arrayList = ['a', 'b', 'c', 'd', 'e', 'f']; // Tạo mảng var anotherArrayList = arrayList; // Tham chiếu đến arrayList từ một biến khác arrayList.length = 0; // Làm rỗng mảng console.log(anotherArrayList); // Kết quả : [] `

while(arrayList.length){arrayList.pop();}

Cách mình vừa thực hiện cũng có thể làm trống mảng. Nhưng không nên sử dụng thường xuyên.

varoutput=(function(x){deletex;returnx;})(0);console.log(output);

Đoạn mã trên sẽ xuất ra0 . Toán tửdelete được sử dụng để xóa một thuộc tính khỏi một đối tượng. Ở đâyx không phải là một đối tượng, nó là ** biến cục bộ **. Toán tửdelete không ảnh hưởng đến các biến cục bộ.

varx=1;varoutput=(function(){deletex;returnx;})();console.log(output);

Đoạn mã trên sẽ xuất ra1 . Toán tửdelete được sử dụng để xóa một thuộc tính khỏi một đối tượng. Ở đâyx không phải là một đối tượng, nó là ** biến toàn cục ** thuộc loại number.

varx={foo :1};varoutput=(function(){deletex.foo;returnx.foo;})();console.log(output);

Đoạn mã trên sẽ xuất raundefined . Toán tửdelete được sử dụng để xóa một thuộc tính khỏi một đối tượng. Ở đâyx là một đối tượng có foo là một thuộc tính và từ một hàm IIFE, mình đang xóa thuộc tínhfoo của đối tượng x và sau khi xóa, mình đang tham chiếu thuộc tính đã xóafoo nên kết quả sẽ làundefined.

varEmployee={company:'xyz'}varemp1=Object.create(Employee);deleteemp1.companyconsole.log(emp1.company);

Đoạn mã trên sẽ xuất raxyz . Ở đây, đối tượngemp1 có company làprototype, xóa toán tử không xóa thuộc tínhprototype

Đối tượngemp1 không có ** company** làm thuộc tính của mình. bạn có thể kiểm tra bằng cáchconsole.log (emp1.hasOwnProperty ('company')); // Kết quả : false Tuy nhiên, chúng ta có thể xóa thuộc tínhcompany khỏi đối tượngEmployee bằng cách sử dụngdelete Employee.company hoặc chúng ta cũng có thể xóa khỏi đối tượngemp1 bằng cách sử dụng thuộc tính__proto__ vàdelete emp1.__proto__.company.

vartrees=["redwood","bay","cedar","oak","maple"];deletetrees[3];

• Khi bạn chạy code trên vàconsole.log(trees); và bạn sẽ nhận được kết quả["redwood", "bay", "cedar", undefined × 1, "maple"]
• Trong các phiên bản gần đây của Chrome, bạn sẽ thấy từempty thay vìundefined x 1
• Khi bạn chạy trên trình duyệt Firefox thì bạn sẽ nhận được kết quả["redwood", "bay", "cedar", undefined, "maple"]

Rõ ràng, Chrome có cách hiển thị cho các index chưa được khởi tạo trong các mảng. Tuy nhiên, khi bạn kiểm tratrees[3] === undefined trong bất kỳ trình duyệt nào, bạn sẽ nhận được kết quả là true. Rõ ràngundefined x 1 đại diện cho các phần tử hay index chưa được khởi tạo.

vartrees=["xyz","xxxx","test","ryan","apple"];deletetrees[3];console.log(trees.length);

Kết qủa của đoạn code bên trên là5. Khi chúng ta sử dụng toán tửdelete để xoá mảng các phần tử , thì độ dài mảng sẽ không ảnh hưởng. Điều này luôn đúng nếu bạn dùngdelete cho từng phần tử của mảng.

Bởi vì khi ta dùng toán tửdelete để xoá các phần tử của mảng thì các phần từ đó sẽ được chuyển thànhundefined x 1 nên độ dài mảng không thay đổi là tất nhiên . Cònundefined x 1 là gì, mời xem

varbar=true;console.log(bar+0);console.log(bar+"xyz");console.log(bar+true);console.log(bar+false);

Kết quả của đoạn code sẽ là1, "truexyz", 2, 1 , bởi vì ta có quy luật sau :

• Số + Số -> Phép cộng
• Biến Boolean + Số -> Phép cộng
• Biến Boolean + Biến Boolean --> Phép cộng
• Số + Chuỗi -> Phép nối chuỗi
• Chuỗi + Biến Boolean -> Phép nối chuỗi
• Chuỗi + Chuỗi -> Phép nối chuỗi

varz=1,y=z=typeofy;console.log(y);

Kết quả của code bên trên sẽ là"undefined" .Theo như quy luật toán tử kết hợp với mức độ ưu tiên như nhau. Quy luật của toán tử gán làPhải sang trái nêntypeof y sẽ được xem xét đầu tiên và giá trị hiện tại của nó là"undefined" và gán choz sau đó gán choy nên ta được kết quả như trên.Code sẽ được thực hiện theo thứ tự bên dưới

varz;z=1;vary;z=typeofy;y=z;  ##Câu15.Kếtquảcủađoạncodebêndướilàgì?```javascript// NFE (Named Function Expression)varfoo=functionbar(){return12;};typeofbar();

Kết quả sẽ làReference Error. Để khắc phục lỗi trên ta sẽ thực hiện như sau :

Cách 1

varbar=function(){return12;};typeofbar();

Cách 2

functionbar(){return12;};typeofbar();

Định nghĩa hàm chỉ có thể có một biến tham chiếu đó là tên hàm , Ở Cách 1bar tham chiếu đến mộtanonymous function và trong Cách 2 chúng ta có định nghĩabar là một tên hàm

varfoo=functionbar(){// foo is visible here// bar is visible hereconsole.log(typeofbar());// Works here :)};// foo is visible here// bar is undefined here

CẬP NHẬT MỖI TUẦN - NHỚ STAR ĐỂ THEO DÕI CÂU HỎI MỚI NHÉ